a responsive equal heights library

matchHeight screenshot

matchHeight makes the height of all selected elements exactly equal (2014)

Modern browsers

This library was developed before related functionality became available in the browser. Therefore it's now strongly recommended to use more modern CSS techniques in place of this library.

For some alternatives see CSS Flexbox and CSS Grid.

Features

  • match the heights for groups of elements automatically
  • use the maximum height or define a specific target element
  • anywhere on the page and anywhere in the DOM
  • responsive (updates on window resize)
  • row aware (handles floating elements and wrapping)
  • accounts for box-sizing and mixed padding, margin, border values
  • handles images and other media (updates after loading)
  • supports hidden or none-visible elements (e.g. those inside tab controls)
  • throttled to balance performance and smoothness
  • easily removed when needed
  • maintain scroll position
  • data attributes API
  • callback events
  • tested in IE8+, Chrome, Firefox, Chrome Android

Download

For some alternatives see CSS Flexbox and CSS Grid.

See matchHeight on GitHub

License

matchHeight is licensed under The MIT License (MIT)