Timothy Long

Art, like morality, consists of drawing the line somewhere.
G.K. Chesterton

Achieve Equal Column Height With CSS

equal-column-height

There are a variety of approaches to obtain equal column height in CSS. The CSS tables method (as outlined below) is not a new one, but I’ve presented it in its simplest form for ease of use:

<div class="container">
	<div class="primary"></div>
	<aside></aside>
</div>

The CSS:

.container {
	display: table;
}
.primary, aside {
	vertical-align: top;
}
.primary {
	width: 70%;
	display: table-cell;
}
aside {
	width: 30%;
	display: table-cell;
}

View Demonstration

Previously