JavaScripts
CSS equal height columns 1
How to add this to your site
Copy and paste the 
JavaScript Code in a plain text editor and save it as column.js to your hard disk.
- Figure out what the ID names of the columns you want to balance are.
- Look for this line at the top of column.js
var divs = new Array('center', 'right', 'left', 'other');
replace these ID names with the names you're using in your HTML and remove what you're not using. - You shouldn't need to edit anything else.
- Link column.js in the header of your page:
<script type="text/javascript" src="(pathto...)/column.js"></script> - That's about it.
CSS equal height columns (jQuery)
How to add this to your site
Copy and paste the JavaScript Code in a plain text editor and save it as jQuery.equalHeights.js to your hard disk.
-
Link the jQuery library in the header of your page:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
or download the latest version
from here.
- Link jQuery.equalHeights.js in the header of your page:
<script type="text/javascript" src="(pathto...)/jQuery.equalHeights.js"></script> -
Put this code in the header of your page:
<script type="text/javascript">
$(function(){ $('.equalize').equalHeights(); });
</script> -
Create a DIV container with a "equalize" class assigned to it, which should wrap your columns.
<div class="equalize">
<div class="column1"> ... </div>
<div class="column2"> ... </div>
<div class="column3"> ... </div>
</div> - That's about it.