HI! please look at my site and tell me how I get this centered on the page Im working with a templete, so I figured out how to move it over, but it will look different in each screen size. I kinda want it to be very similar in each different screen size. thanks!
page positions
Hi Pseudonymph,
There are a few ways to center the content. I have had a play around with one and come up with the result you're after (tested only in ie6 & netscape 7)
The main idea is to firstly remove the absolute positioning and set the left and right margin to auto.
To do this I had to change the structure of your site a little and of course modify the css.
Here is the basic structure of the site notice the order has changes and topbox has been added.
<div id="content"> <div id="topbox"> <div id="site-title"> </div> <div class="date"> </div> </div> <div id="site-graphic"> </div> <div class="logbody"> </div> <div id="side"> </div> </div>
and here is the CSS that changed.
#content { margin-top:10px; margin-left:auto; margin-right:auto; width:600px;} #topbox { width:410px; float:left;} .logbody { float:left; width:400px; margin:0px 0px 0px 0px; padding:5px; background:#cccccc; border:1px solid #666666;} #side { float:right; width:150px; background:#ffffff; border-left:1px solid #999999; font:10px verdana, arial, helvetica, sans-serif; font-weight:normal; color:#666666; padding:2px; margin-bottom:20px;} #site-graphic { float:right; margin-right:20px; margin-top:20px; width:150px; height:150px;}
I hope I haven't left anything out
If you try it out make sure you test it in your target browsers or post it up here again so others can check it out.