Equal height elements

Ultra light plugin for equal height elements or columns
When you have elements which need to sit next to each other, they ofter need to be the same height. The Equal Height Elements plugin uses simple calculation which translates to a lighter plugin and it can be used for many elements on a single page. It can be used for equalizing the height of elements on many rows or on a single row. Equal Height plugin is responsive - if the viewport width is less, the elements arrange according to the set CSS rules and they update their height for every row. The plugin Equal height elements is calculating the equal columns based on CSS. For Internet Explorer 9 and below JavaScript is used to calculate equal columns. For Internet Explorer 10 (and above) and modern browsers, flexbox is used.
For the whole functionality of Equal height elements, see documentation.

How to use

1. Load jQuery and include Equal height elements plugin files
<script src="jquery.js" type="text/javascript"></script>
<script src="dist/equal-height.min.js" type="text/javascript"></script>
2. Call the plugin
<script type="text/javascript">
    $('.parent').wgEqualHeight();
</script>

Browser Support

 
29+
 
28+
 
32+
 
 
6.1+
 
6+

Dependecies

Get the latest jQuery library. Minumum compatibile jQuery version is 1.7.0 version.
Github Download Documentation