CODEWITHSUNDEEP
jquerycssheight
Evan
Evan

Reputation: 3511

List Item Absolute Bottom with JQuery Equal Column Height

I have two things.

  1. have my last list item absolute bottom of my unordered list, but it overlaps the bottom of my unordered list.
  2. I'd like to use the absolute bottom with 'JQuery Equal Column Height' so both my columns are equal to each other since I plan to have beveled borders.

I'm looking for someone to solve this issue for me since I'm stuck at this moment.

This is my jsfiddle with the last list item absolute bottom: http://jsfiddle.net/evanmoore/QPQ8Z/

This is the jquery equal column height with the last list item absolute bottom http://jsfiddle.net/evanmoore/mCang/2/

var maxHeight = 0;
function setHeight(column) {
    //Get all the element with class = col
    column = $(column);
    //Loop all the column
    column.each(function() {       
        //Store the highest value
        if($(this).height() > maxHeight) {
            maxHeight = $(this).height()+2;
        }
    });
    //Set the height
    column.height(maxHeight);
}

$(document).ready(function() {
    setHeight('.wrapper');
});

Upvotes: 2

Views: 212

Answers (1)

darksky
darksky

Reputation: 2090

Initially set position of #disclosure li.notes to relative. This will make the taller column get pushed down, so you can grab the maxHeight. Then, after you got that number, set it back to absolute, so it can be bottom: 0.

http://jsfiddle.net/mCang/3/

Upvotes: 2

Related Questions