Posts: 10,815
Name: Steven Bradley
Location: Boulder, Colorado
|
Everything seemed fine to me down to about 1000px width, which is about how wide your content is.
The problem is likely that you're using positioning for most everything. You really don't need to. Positioning is rarely needed at all in css layouts.
The way to center a site is to wrap a div around everything
<body>
<div id="wrapper">
all your code here
</div>
</body>
Then in your css:
div#wrapper {width:980px; margin: 0 auto}
How much width is up to you and it could be specified as % or any measurement you want, but you do need to include a width. The margin code above says the top and bottom margins are 0 and the left and right should be set automatically. The auto will center your wrapper div within the browser.
You also need to use a proper doctype for the above to work. Not using one sends IE into quirks mode.
Using the above you'd give your entire content are a margin-left to push it over. You might use positioning on your logo. If you do just set the wrapper div to be position: relative. Then when you use position: absolute on your logo it will be relative to the wrapper div and not the whole body. Your top and left on the logo will likely both be 0.
The one reason you might want positioning on the logo here is to use a z-index to sit it on top of the content. |
