line these up on the bottom?

can't line boxes up.

[mandeieio]

im new at this style sheets, and i can't get these boxes to line up on the bottom, so that they are the same height. i have tried padding code and the height code, but height does nothing and padding makes them overlap each other. what am i doing wrong?

<style type="text/css">
body {
margin:5px 0px 0px 5px;
}
#leftcontent {
position: absolute;
left:5%;
width:20%;
top:50px;
        bottom:20%;
       background:#fff;
}
#centerleftcontent {
position: absolute;
left:27%;
width:46%;
        height:20%;
top:50px;
  background:#fff;
}
#rightcontent {
position: absolute;
left:75%;
width:19%;
        height:20%;
top:50px;
       background:#fff;
}
#rightcontent, #centerleftcontent, #leftcontent {
border:1px solid #000;
}
p,h1,pre {
margin:0px 10px 10px 10px;
}
h1 {
font-size:14px;
padding-top:10px;
}
#centerrightcontent p { font-size:10px}

and another question, this code is from a website, im just playing around with it to get an idea--but my other question is, what does hte botom codes mean, and why are they there? p,h1,pre {
margin:0px 10px 10px 10px;
}

[D_Blackwell]

Try changing bottom: 20%; to height: 20%;
#leftcontent {
position: absolute;
left:5%;
width:20%;
top:50px;
----height:20%;-----
background:#fff;
}

----why are they there? p,h1,pre {
margin:0px 10px 10px 10px;----

All paragraphs, h1, and preformatted text should have a margin of 0 on top, and 10px each on the right, bottom, and left