Page 1 of 1

HTML: Vertical Alignment?

Posted: Fri Dec 10, 2004 1:36 pm
by thomasd1
Hi

How can I vertically align a table to the middle of a page, and still have valid xHtml?

Thanks

Posted: Fri Dec 10, 2004 1:51 pm
by rehfeld
this shouldnt be in the php forum



even when you resize the browser wiondow this will remain in the absolute center of the viewport


the key is the negative margins
notice how they are exactly half of the width and height


have fun

Code: Select all

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>

<style type="text/css">



.abs-center &#123;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -200px;
    margin-left: -200px;
    height: 400px;
    width: 400px;
    border: 1px solid #aaa;
&#125;

</style>
</head>
<body>




<table class="abs-center">
<tr>
  <td>table</td>
</tr>
</table>