css - Major problem with 100% height div -
/* left menu */ .leftmenu{ width: 200px; border:2px solid green; float:left; background-color:#c0c0c0; } /* main content area */ .mainbox{ border:2px solid red; background-color: #ffffff; } .mainwrapper{ border:2px solid white; }
with
<div class="mainwrapper"> <div class="leftmenu"> left </div> <div class="mainbox"> main<br /><br /><br /><br /><br /> </div> <div class="clear"></div> </div>
how blazes left menu extend bottom?
please note i've tried faux columns don't work white main box @ front reason.
what this?
i've added postion:absolute
, top:0
, bottom:0
leftmenu
i've given mainbox padding-left: 205px
i've given mainwrapper position:relative
feel free add content mainbox see leftmenu grows well.
to finish off , make work in ie6, add:
.leftmenu, .mainbox { min-height: 250px; height: auto !important; height: 250px; }
Comments
Post a Comment