This is because IE6 interprets code, particularly CSS, differently than Firefox. The only solution is to find code that you find acceptable in both browsers. They will in most cases still display with slight variance, but that’s life.
I have the same problem with IE6. Can anyone share the fix for this?
When it comes to paddings and borders, IE and FF have a different interpretation of the width of the element. IE considers the width of an element to be the with of the content plus the with of the padding, plus the width of the border. FF considers the width to be only the width of the content. So for example, when you have a div with a width of 100px, a padding of 10px and a border of 1px, in IE the width of the content will be 100px – 2×10 – 2×1 = 78px. In FF the width of the content will be the specified 100px, and the width of the entire div with padding and border will have a width of 122px.
Although IE’s interpretation seems more logical, FF’s is the actual correct one as described by the w3c. You can make IE use the correct interpretation by giving it a correct (standard compliant) doctype.
more info on the boxmodel can be found here; and more info on doctypes here.
