CODEWITHSUNDEEP
htmlcsscss-float
Erik Donohoo
Erik Donohoo

Reputation: 653

Sibling floating divs extend same vertical distance

I don't think I'm a total dunce when it comes to CSS but this one has me. The idea is I need a parent element with two floating children to either side. I want the parent height to extend as tall as the children are, and have the children height become equal depending on which child is taller. I have it close but it is not quite there yet. I made this plunkr

http://plnkr.co/edit/kz9VyOxMCLahPbNmyt87?p=preview

Upvotes: 1

Views: 44

Answers (1)

Josh Crozier
Josh Crozier

Reputation: 240998

The easiest method would be to set both elements to display:table-cell, which will basically force them to have the same height as their containing contents.

UPDATED EXAMPLE HERE

.left, .right {
    display:table-cell;
}

This would also require you to remove the floats on the elements.

Upvotes: 1

Related Questions