Content of element not 100% in IE10 inside of equal height columns

Question

For an application I am working on I need equal height columns. I chose to use CSS to style my column items as table\'s. In this way the height of each columns is indeed the max

Answer 1

This seems to be a bug: Make a DIV fill an entire table cell

I would reccomend using display: flex; instead, the html is much more consise.

Fiddle: http://jsfiddle.net/GXe9m/2/

http://css-tricks.com/snippets/css/a-guide-to-flexbox/

Edit: maybe this is not a bug: https://code.google.com/p/chromium/issues/detail?id=97959 After trying the flexbox it seems children elements can still not stretch to height: 100%; in some browsers, one way to fix it is position: relative; on the parent and position: absolute; on the child: http://jsfiddle.net/GXe9m/3/ Another way, though probably not the best is to use the display: flex; rules on the first column as well as on the row.