Home

Equal Heights

Cras mattis consectetur purus sit amet fermentum. Maecenas faucibus mollis interdum.

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum.

Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.

Nulla vitae elit libero, a pharetra augue. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Cras mattis consectetur purus sit amet fermentum. Vestibulum id ligula porta felis euismod semper.

Nullam id dolor id nibh ultricies vehicula ut id elit. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis.

Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus.

Nulla vitae elit libero, a pharetra augue. Nullam quis risus eget urna mollis ornare vel eu leo.

Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

Overview

The Equal Heights plugin makes elements of the same row, the same height. It is also responsive compatible.

HTML


<section class="eqh-wrap">
	<article class="eqh">Maecenas faucibus mollis interdum. Lorem ipsum dolor sit amet.</article>
</section>

Default CSS


.eqh {float:left; width:23%; margin:10px 1%; padding:30px 3%; background:#E9F18B; box-shadow:inset 0 0 0 5px #E0E781;}

Add jQuery & Plugin


<script src="js/libs/jquery.js"></script>
<script src="js/equalheights.js"></script>

Initialize Plugin


$(function(){
	
	// Init - eqHeights
	$('.eqh-wrap').eqHeights();
	
});