Webmasters Stack Exchange is a question and answer site for pro webmasters. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

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 class="page-right">
    <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
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

Your Answer


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.