Home/ Questions/Q 398329
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-12T16:44:16+00:00

The following code renders differently in IE7 and FF3 (NEW CODE POSTED OLD CODE

  • 0

The following code renders differently in IE7 and FF3 (NEW CODE POSTED OLD CODE WAS MISLEADING – sorry for confusion)

     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style>
#boxr1{
background-color:#FFFFFF;
border:3px solid #DDDDCA;
float:right;
width:420px;

}

#boxr2{

background-color:#FFFFFF;
border:3px solid #DDDDCA;
float:right;
width:420px;

}

#boxleft{
border:3px solid #DDDDCA;
color:#277491;
width:300px;
}

</style>
</head>
<body>
<div style="width:800px">
    <div id="boxr1">test<br/>test<br/></div>

    <div id="boxr2">test2<br/>test2<br/></div>

    <div id="boxleft">leftdiv</div> 
</div>
<div style="clear:both;"></div>
</body>
</html>

I can’t seem to figure out what is causing the difference. I want it to behave the way FF does (of course). Any guidance is appreciated. The difference I see is that in FF the left div starts at the top of the page whereas in IE it is rendered “below” the other divs (although it is over to the left).

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I tweaked your original example a little and the code below looks the same in IE, FF, Chrome, and Opera.

         <html>
<head>
<style>

#wrapper{
    width: 923px;
    vertical-align: top;
}

.boxRight{
background-color:#FFFFFF;
border:3px solid #DDDDCA;
float:right;
margin:3px 0;
width:560px;

}

#boxleft{

color:#277491;
width:357px;
float: left;

}

</style>
</head>
<body>
<div id="wrapper">   
    <div id="boxleft">leftdiv</div>
    <div id="boxr1" class="boxRight">test<br/>test<br/></div>
    <div id="boxr2" class="boxRight">test2<br/>test2<br/></div>    
</div>
<div style="clear:both;"></div>
</body>
</html>

    EDIT:
    I updated my code after your edit to your original post. The above works in FF, Chrome, IE, Opera.

    • 0