I few years ago, I wrote a post about forcing two divs to be equal height — quite a feat if you’ve ever tried! Since then, a great jQuery plugin has came out that makes equal div height pretty easy to accomplish.
Using the plugin jQuery.equalHeight, it is as simple as:
|
1 2 3 4 5 6 7 8 |
</p> <div id="container"> <div id="menu"></div> <div id="content"></div> <div> <p><script> $('.container').equalHeights(); </script><br /> |
Of course, you should make your decision to use this method carefully. It’s quick and easy, but if your aren’t using jQuery already, is it worth the load time for this fix? If you want to check out a non-jQuery solution, check out this vanilla JavaScript solution.
