Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I have been using this technique before to get equal column heights

#page-wrap { overflow: hidden;}
.page-left, .page-right{float: left; width: 435px; margin-bottom: -5000px; padding-bottom: 5000px; }
.page-left { background: #454545; }            
.page-right { background: #383838; }

<div id="page-wrap">        
    <div class="page-left">
            Blahblah<br />
            Blahblah<br />
            Blahblah<br />
    </div>    
    <div class="page-right">
            Blahblah
    </div>
    <div class="clearboth"></div>    
</div> <!-- end wrap -->

This works fine but now I need to put #page-wrap inside another DV with margin: 10px;
it works fine in normal browsers, but not in IE...

I have a Fiddle here: http://jsfiddle.net/SyAeq/

EDIT: Solved! Just adding a {float:left} to #page-wrap did the trick!
Than a {clear:left} in a div underneath to clean it up

share|improve this question
    
This question might be better asked on doctype.com. –  Lotus Notes Dec 1 '10 at 18:13
    
thanks, I didn't remember the site. –  FFish Dec 1 '10 at 18:40
    
If you solved it yourself, you should post it as an answer, then when the time period has expired, mark your own answer as correct. –  Mufasa Jun 23 '11 at 21:32
add comment

1 Answer

up vote 1 down vote accepted

Ok, solved this by adding a {float:left} to #page-wrap. Than a {clear:left} in a div underneath to clean it up.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.