ansaurus

Question

Answer 1

+1 A:

It works if you set the object's positioning to be absolute.

Here's an example (I only tried it on Safari):

<html>
  <head>
    <title>Dead Center</title>
    <style type="text/css">
      .dead_center {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        width: 30%;
        height: 30%;
        margin: auto;
        background-color: green;
      }
    </style>
  </head>
  <body>
    <table class="dead_center">
      <tr>
        <td>My centered table</td>
      </tr>
    </table>
  </body>
</html>

No need for any deprecated attributes like align.

Martin Maciaszek 2010-07-06 17:41:23

Add another 19 table rows and it's no longer centered.

Gert G 2010-07-06 18:16:08

Answer 2

+2 A:

http://www.pmob.co.uk/pob/vertical-center1.htm

After you follow that link, right click the page that opened, and view the source code.

You'll notice that IE is tricky because they use conditional commenting (if you're not used to them, it's tricky). What they are doing is taking the height of the window at line 48 of the code and putting the box at 50% of the window's current height, so it even works when resized.

For the other browsers, it should be pretty clear how they do it...using a combination of position, valign, and text align to achieve desired effect.

Hope this helps!

rownage 2010-07-06 17:45:21

Answer 3

A:

From our friends at tutorialzine.com http://demo.tutorialzine.com/2010/03/centering-div-vertically-and-horizontally/demo.html

Catfish 2010-07-06 17:56:53

ansaurus

tags:

views:

answers:

HTML - Vertically Align a Table

related questions