Hi, I've searched a lot on the internet and fora, but nothing really helps. So I'm hoping one of you can help me. Watch this site in IE and Opera and notice the difference of the placement of the Yellow header text in the lower box. The one in IE is the 'right' one, let's say the one I want it to be like. Example CSS: body{ margin: 0px; padding: 0px; background-color: #11090a; font-family: Arial, Helvetica, sans-serif; } #wrapper{ background: url(../images/bg_side.jpg) repeat-x #000000; } #container{ background: url(../images/bg_main.jpg) no-repeat; min-height: 900px; width: 1000px; position: relative; } #content{ padding: 565px 0px 0px 85px; width: 815px; color: #674f5d; font-size: 13px; line-height: 20px; } #content h2{ font-weight: normal; font-family: Georgia, "Times New Roman", Times, serif; color: #dbaa70; margin: 0px 0px 18px 0px; } .column_left{ float: left; width: 230px; margin: 0px 30px 0px 0px; } .column_right{ float: left; width: 500px; } .spacer{ clear: both; height: 30px; overflow: hidden; } #footer{ border-top: 1px solid #3f2324; padding: 30px 50px 80px 50px; color: #674f5d; font-size: 9px; line-height: 14px; } #footer span{ display: block; float: left; width: 250px; } #footer a{ color: #9e8292; text-decoration: none; } #footer a:hover{ color: #ffffff; } Code (markup): The lower 'black' box is divided into two div's. One with classname column_left and the other with column_right. Any ideas how come ?
Now I did notice,, it was because other htm files are included and I did not remove those doctypes and other body's indeed. Used a float right now and a margin to place .column_right correctly, there's still a bit of difference in height (which I don't really mind).. Is this unavoidable ??