Last Updated: February 25, 2016
·
722
· dlikhten

jQuery Same Height

https://github.com/dlikhten/jQuery.sameHeight

I created this little plugin a while back to fix a very big itch. The itch was that there are certain elements on my page that I want to be of equal height. Now sometimes these elements are part of the same parent, in which case there may be CSS solutions. Except that height of divs is the freaken' hardest problem in computer science :P So needless to say, it works quite nicely. An example of what I used it on is: http://blog.doorsteps.com/post/30168002194/doorsteps-new-buyer-profile

So this plugin is pretty simple: find the max height, and set all heights to that.

The best place to use this is probably in $(window).load event. The reason being that this will guarantee that all fonts/images are loaded and you can calculate. I've had problems putting this in .ready.

To note: this is meant as an enhancement feature, not to drive layout. And it works out nicely at that.

Happy coding :)