asp.net - IE not wrapping around floating div but FF is -

i have webpage working in firefox. in ie doesnt wrap properly.

the parents div both columns is:

.underbars { left:0; right:0; top: 140px; position: absolute; } 

in div there 2 divs, 1 floating , other should sit directly right of floating div, reason second div not floating because want take left on space. in ie second div sits directly under first div.

floating div: (should on left hand side)

.cabinetpane { border-right: 1px solid #c1c0c1; border-right-style: solid; border-bottom-style: solid; border-right-width: 1px; border-bottom-width: 1px; border-right-color: #c1c0c1; border-bottom-color: #c1c0c1; font-size: 12px; color: #3b4f65; } 

wrapping div (should directly right , take available space)

<div> </div> //no css 1 

best solution come have div has single purpose of aligning things (it structure, no color / borders displayed).

here box model:

that div im talking 1 want "take left on space" aka orange box. inside div style applied dictates, div have margin-left (this margin should wide float-left column had) when div placed inside , given width:100%, in case blue div (i gave 90 because of padding , borders etc. need fiddle around based on borders/margins/padding have) blue div occupy rest of space.

to sum colour:

• black = left column div fixed with
• orange = div used structure (should not have borders / background etc.)
• greed = metaphorical representation of left-margin used on orange div
• blue = div fills space on right.

p.s. tested in ie8

you can find css/html in jsfiddle , recomend using jsfiddle every time posting css/js/html related issue picture paints 1000 words.