valign="middle"

[peterpann]

The following code produces concentric rectangles in FX, Opera and Chrome, but at the top of the page. How can it
appear in the middle of the page ? How to make it the same in IE ? How can it be done with CSS, ignoring borders, cellpadding and cellspacing ?
<code>
<table align="center" valign="middle" width="50%" height="50%">
<tr>
<td align="center" valign="middle" bgColor="brown">
<table width="50%" height="50%">
<tr>
<td align="center" valign="middle" bgColor="red">
<table width="50%" height="50%">
<tr>
<td align="center" valign="middle" bgColor="yellow"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</code>

 

[Vragabond]

Check Stu Nichols' simple method for centering an element within its container. Stu does it with pictures, but it should work with any container.

http://www.cssplay.co.uk/menu/centered.html

[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]

 

[darryncooke]

I would also suggest you not use tables.

Darryn Cooke

http://www.darryncooke.com

| Marketing and Creative Services

 

[nyteshades]

It's ok to use a table for a table, but I think what you want is to enclose your table with in a <div> tag. In which case:

<code>
<div align="center">
<table align="center" valign="middle" width="50%" height="50%">
<tr>
<td align="center" valign="middle" bgColor="brown">
<table width="50%" height="50%">
<tr>
<td align="center" valign="middle" bgColor="red">
<table width="50%" height="50%">
<tr>
<td align="center" valign="middle" bgColor="yellow"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</code>

http://www.nyteshades.com