How to give 3 floated div's the same height in CSS?

Never mind. I’ve gone back to tables. (but only for that part)
Div’s can be very, very, very painful sometimes…

I support your decision. I think people who think tables are ugly are not being honest about some of the hacks required to make floating divs work.

Your mom.

@tonystubblebine: Thanks!
@Anaphase: wtf.

I don’t think too many people are opposed to tables because they’re ugly, but because it’s a semantically improper way to mark up presentational elements. Tables are for tabular data, not background images, spacers, and the like. I would recommend that you revisit doing this in CSS. I don’t have a solution off hand, but I can say that one of your <div> elements is superfluous. Generally this layout works best if you have one element that contains your left-hand rounded corners, both top and bottom, and another element, such as a <p> or another <div> (remember, try to remain as semantic as possible) that has a background, fixed on the right side, that makes up the right corners, both top and bottom.

@noyesa Thanks, but I think I won’t. Now that I’ve used tables, the site works beautifully in IE6, and if I resorted to using divs and css, I’d have to use a lot of hacks to get it right in IE6.

Thanks for replying though. :)

This question is somewhat old but for the benefit of those who may come later here are some resources for creating/controlling layouts with CSS:

Maxdesign
Incutio
glish

As you can see it is possible to do exactly what was requested with CSS.

It hurts to see people abandoning divs/css for table’s! With all respect, what-ever works for you is fine.. But I’d say, put a little effort into getting the hang of how div’s work, you WILL praise them.

Second, there are templates to be found everywhere on the web. Use them if you can and learn while adjusting them.

I guess you don’t want to know my ideas on that rounded box with divs?

Oh and always work one version of every browser behind, but never more then one. You want everyone to see your site correct but you also don’t want to be to limited in what you do. You can’t please every ‘90s computer.
Having said that, IE6 isn’t that bad. Well it is bad but properly layed out div’s with valid css markup never appeared any different in my case.

<div id=“some_height_container>
<div class=“some_height”></div>
<div class=“some_height”></div>
<div class=“some_height”></div>
</div>

/* CSS FILE */
div.some_height_container{
height: 400px
}
div.some_height{
float: left;
height: 100%;
width: /some_height_containers width divided by 3 minus borders/margin/etc../

Hope this helps.
PS: Haven’t tested it, but it should work.