Sưu tầm

The problem is very simple: First you have to add a class named "elements" to both columns so your html will look like this: <div id = "content" > <div id = "leftColumn" class = "elements" > left column stuff </div> <div id = "rightColumn" class = "elements" > right column sidebar stuff </div> </div> After this, all you have to do is to compare the 2 heights, and aplay the maximum height to the smallest one. You do this like this: $ ( document ). ready ( function () { var highestCol = Math . max ( $ ( '#leftColumn' ). height (), $ ( '#rightColumn' ). height ()); $ ( '.elements' ). height ( highestCol ); }); Its a jQuery code witch calculate the maximum height between the 2 columns, and set them both with that height, resulting 2 columns with the same height. (the biggest one) Theo http://stackoverflow.com/

Using simple jQuery code you can achieve the equal column height DEMO HTML <div id = "container" > <fieldset class = "box" > <legend> Title </legend> CONTENT <br/> test </fieldset> <fieldset class = "box" > <legend> Title </legend> CONTENT </fieldset> <fieldset class = "box" > <legend> Title </legend> CONTENT </fieldset> </div> CSS . box { float : left ; width : 25 %; } jQuery $ ( function () { var H = 0 ; $ ( "div" ). each ( function ( i ) { var h = $ ( ".box" ). eq ( i ). height (); if ( h > H ) H = h ; }); $ ( ".box" ). height ( H ); });