View Full Version : Jquery equalise columns not working

09-29-2010, 04:57 PM

I was wondering if someone might be able to help me. I'm trying to use Jquery to set 3 columns in my layout all to have an equal height. You can see my layout here www.juanchandler.com

I've used this bit of code that was described here.... http://www.cssnewbie.com/equal-height-columns-with-jquery/ but nothing happens when my page loads....ie. the two flanking columns aren't the same height as the middle one as I wanted.

If you view the source of my page you'll see I'm linking to jquery on google's api, have the plugin code in the head of the document along with all the CSS also in the head. If someone could have a look and let me what I'm doing wrong I would be very grateful

thank you very much.

09-29-2010, 06:58 PM
Two things here. You have:


which is only ever going to return one div to the equalHeight function. This needs to be something like:

equalHeight($("#content div"));

...but your html is structured so that there is only one div inside #content anyway - you need to rebuild your html/css so that the three column divs are all within #content - they aren't at the moment.