Equal Heights with only CSS

There are several methods to achieve equal heights of containers in CSS. In fact, Chris Coyer outlines several ways. His options focus on options that don’t require multiple rows of items.

If you need multiple rows of items that all need to be the same height, consider the following techique. This was the first solution I’ve encountered that supports multiple rows; all others required a single row.

selector {
	display: inline-table;
	vertical-align: top;

Since vertical-align is inheritable, if a parent’s vertical alignment is set, it will inherit that. The height of the items will be defined as the tallest item in the row. Browser support is all recent browsers and IE8.