Im designing a site for a school project and im only allowed to use html and css (NOT JavaScript). But i have a problem when i try to float 3 divs to the same row. One of the divs is width: 100%; so that div pops down to the row below. It works fine in Firefox, all the three divs is on the same level, but not in IE.

i'm just curious.. why are you setting the width:100% to the middle part of the topleft and topright? just erase those...

youve set the size of this login which is...
#login{
width: 500px;
height:50px;--> remove this.. if you want a dynamic height..
}

just do the math homie...

<div id="login">

<div class="windowtop">
<div class="topleft">&nbsp;</div>
<div class="topright">&nbsp;</div>
<div class="top">&nbsp;</div>
</div>
<div class="clear"></div>--> this is to make sure that the next div which is window middle starts at the bottom of window top...