CODEWITHSUNDEEP
htmlcss
Bastiaan Zwanenburg
Bastiaan Zwanenburg

Reputation: 143

Give parent div same height as child div

I have a problem. I have (simplified) this code:

<div class="page">
  <div class="leftcolumn">content</div>
  <div class="midcolumn">some text
      <div class="midcolumn content">more text</div></div>
   <div class="rightcolumn">a nice widget, or so</div>
</div>

left, mid and right column are just floated and have apdative (=%) widths, and that works fine. Unfortunately, the height of the three columns are right, they are just the height of the content that's in them. Unfortunately, the div page gets a height of 1px, even while columns in it are way bigger. How do I get the page div to get the same height of the columns. For example, if the largest of the three columns has a height of 1000px, I want the div page to get a height of 1000px. Can anyone tell me how I should do that?

Upvotes: 1

Views: 1761

Answers (1)

j08691
j08691

Reputation: 207861

Add overflow:auto to your page div.

Upvotes: 5

Related Questions