size of div container is equal to size of two child divs, but divs drop in IE
I am having a floating issue in IE 8 with this site:
HL Law Group
The divs involved are the following:
#wrapper div 980px
#main div 698px
25px padding on left and right
so 698 + 25 + 25 = 748px
#panel div width 230px and border left and right 1px
so 230 + 1 + 1 = 232px
748 + 232 = 980px
which is the width of the wrapper
This works fine on Google Chrome, Firefox, and Safari.
However, on IE 8, something strange happens.
1) On the home page, the #main div drops below the #panel div, as if the main div is too wide to fit within the wrapper, but math above shows this behavior shouldn't happen
2) If you go to the about page, you will notice that the #main div is not snuggled up against the #panel div, but rather there is a gap between them. But the math above shows that there should be no gap. So between the home and about pages, in IE, two very strange behaviors occur.
In Google Chrome, Firefox, and Safari, it displays as expected.
Thanks for response.