Spacing issues in different browsers.

The actual problem is not obvious because the #productGroupWrapper2 has a margin-top:-12.8em; which brings it up higher than it would normally be. The right-floated elements are affected by the clearBoths on elements inside the left-floated wrapper.

The problem is shown in the image above, help please!!!!

P.s soz for my miss spelling of browser

Try:

#productGroupWrapper2 {
    float:right;
    padding:0.5em;
    margin-top:0em;
    width:360px;
    height: auto;
    min-height:100px;
    background: #EFEFEF;
    text-align: left;
    border: 1px solid #C9DCFA;
}

yellow1912:

Try:

#productGroupWrapper2 {
float:right;
padding:0.5em;
margin-top:0em;
width:360px;
height: auto;
min-height:100px;
background: #EFEFEF;
text-align: left;
border: 1px solid #C9DCFA;
}

Lol nearly worked, since u took the left margin out it has bought all the items up below it, definitely an improvement, nearly there!

Orchard_Direct:

Lol nearly worked, since u took the left margin out it has bought all the items up below it, definitely an improvement, nearly there!

Since you are floating the 2 divs, if you want to leave the items below them there you have to have this right after the 2 floating divs

The genious above me solved the solution :P Many thanks to him and everyone that helped me :D