Step one finished!
Ok, the next thing to do is go through your elements, and make sure you don't have any side paddings/margins on elements with a set width. You also want to make sure you don't have any top/bottom paddings/margins on elements with a set height.
For example, your sidebar is set with this CSS:
float:left;
padding:15px 20px;
width:200px;
IE renders paddings and margins differently than every other browser. So what you do is use two divs. So change your sidebar to this:
<div id="sidebar1">
<div id="sidebar_padding">
// sidebar stuff
</div>
</div>
And set your CSS like this:
#sidebar1
{
float:left;
width:200px;
}
#sidebar_padding
{
padding:15px 20px;
}
This way the width is the same for the sidebar whether it's IE or another browser, and the padding will also render the same for all browsers, since the padding is not combined with a width.
Find any other elements you have done this (combined a width with a margin and/or padding) and do the same thing - add an inner div, then put the margins/padding on the inner div.
