IE8 > background spills out > overflow: hidden partialy fixes it

I have a problem appearing only in IE8, but I don’t seem to find the exact bug and solution.

In this page

there is a Details area (bottom left) where titles have a green background.
For some reason this green background appears in other parts of the page.
In other browsers, the whole page has a white background, as it should.

  1. With this code in theme.css

a {color:#62860b; }
h3, h4 { color: #70af1d;}
.color_title { background: #76a637;color:#fff;}
.logo h1 a { color: #62860b !important;}

it appers everywhere and the whole background of the page is green (should be white).

  1. when I add an “overflow: hidden;” here

.color_title { background: #76a637;color:#fff; overflow: hidden;}

it gets better, as the main area is white.
But I still have a lot of green on the footer (and tabs).

If I could find out to which bug it refers, it would be easier to find a solution.
Any hint would be appreciated!



Hi Rayzur,
Thank you very much.
I had seen the validation but somehow got convinced that it was IE8’s fault as I could not find the “</h6<p>” code in other browsers.
Turns out it was in the TAB and I missed it in the PHP component.
Thank you!

You have multiple errors that need to be fixed on that page.

The IE problem specifically seems to be this h6 that is not closed around line 675.

(scroll all the way to the right)

<div class="dynamicField hidden" id="tab-dynamic_fields">
        [B]<h6 class="color_title">[/B]<img width="32" height="32" src="/community/uploads/category_icon/real-estate_21.png" align="absmiddle" />&nbsp;Bathroom&nbsp;(Bathroom)[B][COLOR=Red]</h6<p>[/COLOR][/B]

As you know that green BG color is being applied to your h6 in this class

[B].color_title[/B] {
background:none  repeat scroll 0 0 #76A637;