Help, How do I create an equal columns?

[bbmak]

I try to create an equal columns of my site, but I can’t figure out with the css. I hope some experts can help me here.
CSS Style Sheet

#container{

overflow: hidden;

border: 1px solid black;

padding-bottom: 30000px;

margin-bottom: -30000px;

}





/* navigation left panel box */

#left_panel {

border:2px solid;

border-radius:20px;

-moz-border-radius:20px; /* Firefox 3.6 and earlier */

background-color:#FFFFFF;

box-shadow: 2px 2px 2px #333333;

width: 150px;

height: 100%;

float:right;

padding: 0 16px;

border-style:solid;

border-color:#4fbdf0;

line-height:150%; /* Text space - 100% is normal */

}

/* navigation left panel box */



/* change link color */

a:link{

color:#4fbdf0;

}

a:visited{

color:#4fbdf0;

}

a:hover{

color:#4fbdf0;

}

a:focus{

color:#4fbdf0;

}

a:active{

color:#4fbdf0;

}

/* change link color */



/* navigation center panel box */

#center_panel {

border:2px solid;

border-radius:20px;

-moz-border-radius:20px; /* Firefox 3.6 and earlier */

background-color:#FFFFFF;

box-shadow: 2px 2px 2px #333333;

margin:auto;

width: 95%;

height: 100%;

padding: 0px 16px;

border-style:solid;

border-color:#4fbdf0;

}

/* navigation center panel box */



/* navigation right panel box */

#right_panel {

border:2px solid;

border-radius:20px;

-moz-border-radius:20px; /* Firefox 3.6 and earlier */

background-color:#FFFFFF;

box-shadow: 2px 2px 2px #333333;

width: 150px;

height: 100%;

padding: 0 16px;

border-style:solid;

border-color:#4fbdf0;

}

The Template Page

Category 

[poonu]

// using jquery

// add class ‘.eqheight’ on each columns

function EqHeight()
{
var tallestHeight = 0;
$(‘#container .eqheight’).each(function () {
var bigHeight = $(this).height();
if (bigHeight > tallestHeight) {

tallestHeight = bigHeight;
// alert(tallestHeight);

}

});
$(‘#container .eqheight’).css(‘height’, tallestHeight);
}

// (‘_ ‘) Happy Coding….

[Author]

Posts