CODEWITHSUNDEEP
htmlcss
ByulTaeng
ByulTaeng

Reputation: 1269

Stretch right float div width?

I have 2 float:left div, the first is fixed and i want the second div stretch the remain space.

<div id="container">
 <div id="leftform"> </div>
 <div id="rightform"> </div>
</div>

Any idea? Thanks

Upvotes: 7

Views: 7100

Answers (2)

user80276
user80276

Reputation:

use a javascript function to make both equal in height. 

//fixing column height problem using Prototype
Event.observe(window,"load",function(){                         
    if(parseInt($('leftform').getStyle('height')) > parseInt($('rightform').getStyle('height')))
        $('rightform').setStyle({'height' : parseInt($('leftform').getStyle('height'))+'px'});
    else
        $('leftform').setStyle({'height' : parseInt($('rightform').getStyle('height'))+'px'});
});//observe

same problem here.

Upvotes: 0

Kornel
Kornel

Reputation: 100200

In CSS2:

#container {display:table; table-layout:fixed;}
#leftform, #rightform {display:table-cell;}
#leftform {width:100px;}

In world of IE hacks:

#container {padding-left:100px;}
#leftform {float:left; width:100px; margin-left:-100px;}

Upvotes: 8

Related Questions