Is there an equivalent of valign="bottom" for a table within a DIV
using CSS?
I've found I can center a table of buttons in a DIV with
{margin-left:auto; margin-right:auto}. But I am unsure how to get this
table to sit at the bottom of the DIV.
Example code follows, or see
http://home.exetel.com.au/tas/valign/test01.html
p.s. If there is a better way than using a table to line up the button
images in CSS, I'd love to know.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Test01</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<style>
body {
background-color:#ffcc00;
}
div#logo {
float:left;
height:91px;
width:135px;
background-color:#d0d2be;
}
div#sitemenu {
float:left;
height:91px;
width:407px;
background-color:#e0d2be;
}
div#sitemenu table {
margin-left:auto;
margin-right:auto;
}
div#sitemenu table td {
padding-left:10px;
padding-right:10px;
}
div#emailjoin {
float:left;
height:91px;
background-color:#f0d2be;
}
</style>
</head>
<body>
<div id="logo">
<p>logo</p>
</div>
<div id="sitemenu">
<table>
<tr>
<td>btn1</td>
<td>btn2</td>
<td>btn3</td>
</tr>
</table>
</div>
<div id="emailjoin">
<p>join our emailing list</p>
</div>
</body>
</html>
