It’s the left margin on the sidebar that’s killing the site. IE handles margins different than other browsers do.
Embed content and sidebar in a div, and make them float left.
Peter
This is what the site looks like in Firefox. I suppose adding a forced space to move the content over would solve one problem, but why doesn’t the header even show up in IE, for instance?
Thanks for your help.
Again, you should NOT be positioning containers with (left) margins, because that’ll give unexpected results in different browsers.
example:
<div id="wrapper">
<div id="content">
<div class="post">
<p>your content goes here</p>
</div> <!-- end class post -->
<div class="post">
<p>your content goes here</p>
</div> <!-- end class post -->
</div> <!-- end content -->
<div id="sidebar">
<ul>
<li>sidebar entry</li>
<li>sidebar entry</li>
</ul>
</div> <!-- end sidebar -->
</div> <!-- end wrapper -->
and the css:
#wrapper {
width: 900px;
margin: 0 auto;
}
#content {
width: 600px;
float: left;
}
#sidebar {
width: 300px;
float: left;
}
Peter
Now I understand. Thank you for taking the time and effort for instructing me on something you probably find very basic. I am not skilled at programming. Trial-and-error, learn-on-the-fly… Thanks very much for your help. I appreciate it.
