There is no doubt that Twitter Bootstrap is the most famous front-end framework nowadays. It’s used by millions of developers. Though, it has limitations and you need to do workarounds to overcome it.
One problem that faces a great number of web designers comes up when have different columns with different size of content which results in having columns with unequal heights. There is no straightforward way to overcome this. There are two ways to do it. First, using CSS. And the other is a jQuery solution.
First, let’s assume that we have a row with the following structure.
This will of course result in 3 columns with different heights. If you have a background color for them, this will really look ugly and unprofessional.
First, you can use this CSS3 based solution. Please not that it will only work with modern browsers.
By adding the class “equal” to the div row, and adding the following class to your css, you can achieve what you the equally hrighted columns.
