Jump to content


Photo

what version of HTML?


  • Please log in to reply
21 replies to this topic

#21 michaellunsford

michaellunsford
  • Members
  • PipPipPip
  • Advanced Member
  • 1,023 posts
  • LocationLouisiana, USA

Posted 18 September 2006 - 09:53 PM

You'll want to warp your table inside a block level element if you want to center your table:

<div style="text-align: center">
  <table border="1" cellpadding="2" cellspacing="1">
    <tr>
      <td>Hello world</td>
    </tr>
  </table>
</div>


A note on this one. I have tried and it is not centering. If I give the DIV a border, it shows it going 100% horizontal, however, the inner content remains left justified.

#22 smashingred

smashingred
  • Members
  • PipPip
  • Member
  • 15 posts

Posted 19 September 2006 - 03:18 AM

Despite my personal objections to using tables for layout, you need to apply the centering to the table and not to the container. The following will work in almost every browser:

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

<html>
<head>
<title>Test</title>
</head>
<body>
<div>
<table style="border:1px solid #000; width:500px;margin:1px auto;">
<tr><td>Hello World!</td></tr>
</table>
</div>
</body>
</html>


It is important to note that this type of style should be called from a linked file and not in the HTML and may be represented as follows:
table{
     width:500px;
     margin:1px auto;
     border:1px solid #000;
     }

Also you MUST declare the doctype or when IE is thrown into quirks mode it will not render the table as centered.

Now just so you know, there is no reason you can't use another div instead of a table to contain the page content. That being said, I am glad that you are making the move to better, more modern coding.

All the best,
Jay




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users