View Single Post
Old 11-30-2007   #12 (permalink)
notjustgraphics
Rusty Bio-Hazard!
 
notjustgraphics's Avatar
 
Join Date: Sep 2006
Location: Toronto, Ontario, Canada
Posts: 1,047

Send a message via MSN to notjustgraphics
Hey Roosta

Try this... it's a quick fix, but it should work without too much code changing.

Immediately under the <body> tag, add the following two lines of code:

HTML Code:
<div style="width:100%"> <!-- create container div -->
  <div style="position:relative; width:950px; margin:0 auto;"> <!-- center inner div within the container div -->
Then, immediately before the </body> tag you need to close the two divs created above with:

HTML Code:
  </div> <!-- close div.inner -->
</div> <!-- close div.container -->
That should work for ya...

Basically, we're creating an envelope to tuck the entire site into... The envelop is sized in percentage (100%) to 'learn' the window size of the user's browser.

Then, inside of the main envelope, we tuck another envelope, but now, because we've learned the overall width of the user window, we can position the inner envelope in the center using the margin:0 auto; css tag.

In order for this to work, the width of the inner div (or envelope) has to be declared. I used 950px in my example because it appeared to be the maximum width of your site, but you can fine tune that value if necessary.

I find dreamweaver (and golive for that matter) to be great editors but when it comes to WYSIWYG generators, they do what they can but are no substitute for a strong knowledge of HTML and CSS.

Cheers.

Mike.
__________________
notjustgraphics is offline   Reply With Quote