Closed Thread
Results 1 to 5 of 5
  1. #1
    Newbie
    Join Date
    Sep 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Centering css from photoshop in dreamweaver

    I am very new to css and dreamweaver. just started yesterday. I have this code below. the site comes up fine but it is aligned all the way to the left. I want it to be centered to every browser. Is this possible? I thought since i was adding the css from photoshop to a div in would take the div attributes, but it does not. I am probably doing this all wrong. Please do not comment unless you have an informed answer. I know I need to learn css , that is why I am posting

    here is my css rules

    #wrapper {
    margin-right: auto;
    margin-left: auto;
    background-color: #FFFFFF;
    width: 0px;
    }
    #site {
    height: 0px;
    width: 0px;
    background-color: #00FF66;
    background-position: 0px 0px;
    padding: 0px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    }
    #wrapper #site {
    margin-right: auto;
    margin-left: auto;
    }







    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"><head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Lacyidos</title>
    <style type="text/css">
    <!--
    body {
    background-color: #FFFFFF;
    background-image: url(images/bg.jpg);
    text-align: center;

    }

    div.newsite-01_ {
    position:absolute;
    left:0px;
    top:0px;
    width:824px;
    height:125px;
    }

    div.newsite-02_ {
    position:absolute;
    left:0px;
    top:125px;
    width:26px;
    height:550px;
    }

    div.newsite-03_ {
    position:absolute;
    left:26px;
    top:125px;
    width:154px;
    height:20px;
    }

    div.newsite-04_ {
    position:absolute;
    left:180px;
    top:125px;
    width:154px;
    height:20px;
    }

    div.newsite-05_ {
    position:absolute;
    left:334px;
    top:125px;
    width:154px;
    height:20px;
    }

    div.newsite-06_ {
    position:absolute;
    left:488px;
    top:125px;
    width:154px;
    height:20px;
    }

    div.newsite-07_ {
    position:absolute;
    left:642px;
    top:125px;
    width:154px;
    height:20px;
    }

    div.newsite-08_ {
    position:absolute;
    left:796px;
    top:125px;
    width:28px;
    height:459px;
    }

    div.newsite-09_ {
    position:absolute;
    left:26px;
    top:145px;
    width:770px;
    height:439px;
    }

    div.newsite-10_ {
    position:absolute;
    left:26px;
    top:584px;
    width:772px;
    height:38px;
    }

    div.newsite-11_ {
    position:absolute;
    left:798px;
    top:584px;
    width:26px;
    height:91px;
    }

    div.newsite-12_ {
    position:absolute;
    left:26px;
    top:622px;
    width:772px;
    height:53px;
    }
    -->
    </style>
    <link href="css/layout.cc" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <div id="wrapper">
    <div id="site">
    <div class="newsite-01_">
    <img id="newsite_01" src="images/newsite_01.gif" width="824" height="125" alt="" />
    </div>
    <div class="newsite-02_">
    <img id="newsite_02" src="images/newsite_02.gif" width="26" height="550" alt="" />
    </div>
    <div class="newsite-03_">
    <img id="newsite_03" src="images/newsite_03.gif" width="154" height="20" alt="" />
    </div>
    <div class="newsite-04_">
    <img id="newsite_04" src="images/newsite_04.gif" width="154" height="20" alt="" />
    </div>
    <div class="newsite-05_">
    <img id="newsite_05" src="images/newsite_05.gif" width="154" height="20" alt="" />
    </div>
    <div class="newsite-06_">
    <img id="newsite_06" src="images/newsite_06.gif" width="154" height="20" alt="" />
    </div>
    <div class="newsite-07_">
    <img id="newsite_07" src="images/newsite_07.gif" width="154" height="20" alt="" />
    </div>
    <div class="newsite-08_">
    <img id="newsite_08" src="images/newsite_08.gif" width="28" height="459" alt="" />
    </div>
    <div class="newsite-09_">
    <img id="newsite_09" src="images/newsite_09.gif" width="770" height="439" alt="" />
    </div>
    <div class="newsite-10_"><object classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,22,0" id="footer" width="772" height="38"> <param name="movie" value="footer.swf"> <param name="bgcolor" value="#FFFFFF"> <param name="quality"
    value="high"> <param name="loop" value="false"> <param name="wmode" value="transparent"> <param name="allowscriptaccess" value="samedomain"> <embed type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" name="footer" width="772" height="38" src="footer.swf" bgcolor="#FFFFFF"
    quality="high" loop="false" wmode="transparent" swliveconnect="true" allowscriptaccess="samedomain" > <noembed> </noembed> </embed></object>
    </div>
    <div class="newsite-11_">
    <img id="newsite_11" src="images/newsite_11.gif" width="26" height="91" alt="" />
    </div>
    <div class="newsite-12_">
    <img id="newsite_12" src="images/newsite_12.gif" width="772" height="53" alt="" />
    </div>
    </div>
    </div>
    </body>
    </html>

  2. #2
    Senior Member
    Join Date
    Nov 2009
    Posts
    165
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Put in the CSS of your main DIV:

    margin-right: auto;
    margin-left: auto;

    or enter it here:


  3. #3
    Junior Member
    Join Date
    Nov 2009
    Location
    Telford, England
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I have a suggestion that will save you a lot of headache in the future. copy everything that's inbetween the style tags (so from "body {" to "height:53px;}") and paste it into notepad. then go File > Save As. Where it says "Save as type:" select "All files", and then where it asks for a name, type in something like "style.css" and save it in the same folder as the webpages that use that code.

    Then, on all the pages that you want to have this CSS coding on, instead of having a massive long list of CSS, have this single line:
    Code:
    <link rel="stylesheet" type="text/css" href="style.css">
    This way you not only cut down on file size, but you can also edit the CSS parameters for all pages in one place

    EDIT

    The <link> tag must go inbetween the <head></head> tags by the way.

  4. #4
    Junior Member
    Join Date
    Dec 2010
    Posts
    24
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Centering css from photoshop in dreamweaver

    Quote Originally Posted by Mike Read View Post
    I have a suggestion that will save you a lot of headache in the future. copy everything that's inbetween the style tags (so from "body {" to "height:53px;}") and paste it into notepad. then go File > Save As. Where it says "Save as type:" select "All files", and then where it asks for a name, type in something like "style.css" and save it in the same folder as the webpages that use that code.

    Then, on all the pages that you want to have this CSS coding on, instead of having a massive long list of CSS, have this single line:
    Code:
    <link rel="stylesheet" type="text/css" href="style.css">
    This way you not only cut down on file size, but you can also edit the CSS parameters for all pages in one place

    EDIT

    The <link> tag must go inbetween the <head></head> tags by the way.

    -Mike has the right idea (time saver)

    have you try putting the [align center] code into your css sheet. This might be what you are looking for to make things centered.

  5. #5
    Guru
    Join Date
    Aug 2010
    Location
    The Abyss
    Posts
    952
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Centering css from photoshop in dreamweaver

    Again this thread is a year old..

    closed thread.
    You can call me Kev, if you need anything just ask! Please take a moment to read the rules here!
    FORUM RULES PLEASE READ - CLICK HERE TO READ
    FREELANCE SECTION RULES - CLICK HERE TO READ

 

 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
Powered by vBulletin® Version 4.1.9
Copyright © 2012 vBulletin Solutions, Inc. All rights reserved.
Content Relevant URLs by vBSEO 3.6.0
Copyright 2011 Photoshop Gurus Forum. All rights reserved.
All times are GMT -5. The time now is 07:49 AM.