1 Reply Latest reply on Mar 16, 2010 5:19 PM by Rick2001

    Fixed Width Area To Place All Page Elements

    Rick2001

      I have a background that I've saved as a template. Now I want to add an area to it that'll be fixed width and stay centered; much like the look of most blogs.

       

      What do I do to make an area into which I can put the content of various pages?

        • 1. Re: Fixed Width Area To Place All Page Elements
          Nancy OShea Adobe Community Professional & MVP

          To center a web page you need three things:

           

          1) A valid document type (HTML or XHTML).  DW does this automatically when you create a new page.

          2) A container width in pixels, % or ems,

          3) A margin-left and margin-right of auto (browser defined width).

           

          So the CSS code for a fixed-width, centered layout would look like this:

           

          body {

          background: url (your-BG-image.jpg;

          text-align: center /**centers in older browsers**/

          }


          #wrapper {

          width: 900px; /**adjust width as needed**/

          margin: 0 auto; /**centers modern browsers**/

          text-align: left;

          }

           

          HTML code:

           

          <body>

          <div id="wrapper">

          All your page content goes here...

          </div>  <!--end of wrapper-->

          </body>

           

           

          Nancy O.
          Alt-Web Design & Publishing
          Web | Graphics | Print | Media  Specialists
          http://alt-web.com/
          http://twitter.com/altweb
          http://alt-web.blogspot.com