Vertical Centering in CSS

[gwx03]

Does anyone know how to do vertical centering? There doesn't seem to be much information in this field...

I tried the table method of centering stuff but it so happens that it doesn't work in my case... and I heard its the only method?

So here's what I did ( source code here ) :

<table border=0>
<tr>
<td>
<div class="container">
<div class="banner">
[img]bannergwx.png[/img]
</div>
</div>

</td>
</tr>
</table>

Sorry bout my alignment, but is it correct? My external CSS file (general.css) code is below....

.container {
background-image: url(background.jpg);
background-repeat: repeat-y;
height: 600px;
width: 955px;
border: 1px solid #FFFFFF;
margin-right: auto;
margin-left: auto;
}
.banner {
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #000000;
}


table {
width: 100%;
height: 100%;
}

td {
vertical-align: middle;
}


Please be patient with my numerous CSS questions but I'm just starting out on this area... I have only just heard of it in webforumz!

[Webforumz Staff]

Check this page out http://www.wpdfd.com/editorial/wpd0103.htm#toptip

The trick is to use a percentage (50%) for the "top" and then a negative "margin-top".