Drupal Template: 
UQ Base Template

Equalise is a javascript that sets equal heights on a set of elements. For instance a grid list with different lengths of content; equalise will set them all to have the same pixel height as the tallest element in the set.

How to use

Add the class .equalise to the parent of the elements you want to have equal heights.

Add .equal-height to each of the elements.

<ul class="equalise">

    <li class="equal-height">Short content</li>

    <li class="equal-height">Longer content than the short content</li>

    <li class="equal-height">Longest content of them all so that this is the list item that defines the height for all of the items in this list</li>

</ul>

Example

  • Short content
  • Longer content than the short content
  • Longest content of them all so that this is the list item that defines the height for all of the items in this list