Welcome to WebmasterWorld Guest from 54.160.221.82

Forum Moderators: not2easy

Message Too Old, No Replies

Centering a table on the page

Centering a table on the page

     
3:59 pm on Sep 25, 2007 (gmt 0)

Preferred Member

10+ Year Member

joined:Apr 1, 2005
posts:369
votes: 0


I've got a page with a two row, two column table on it, and I've specified the width of the table as 300px as described below.

<table style="width: 300px">
<tr>
<td>
<p>Text 1 here.</p>
</td>
<td>
<p>Text 2 here.</p>
</td>
</tr>
<tr>
<td>
<p>Text 3 here.</p>
</td>
<td>
<p>Text 4 here.</p>
</td>
</tr>
</table>

Right now, the table is aligned with the left margin of the page, and I'd like it to be centered between the left and right margins.

Help!

4:08 pm on Sept 25, 2007 (gmt 0)

Senior Member

WebmasterWorld Senior Member whoisgregg is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Dec 9, 2003
posts:3416
votes: 0


You can set
text-align: center
on the parent element and use
margin: 0 auto;
on the table itself.
4:47 pm on Sept 25, 2007 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:June 26, 2004
posts:1497
votes: 0


You don't actually need the text-align: center on the parent, just the magin: 0 auto on the table will do.
6:23 pm on Sept 25, 2007 (gmt 0)

Preferred Member

10+ Year Member

joined:Apr 1, 2005
posts:369
votes: 0


Superb Robin and Gregg

That worked just fine. I had several tables to do, but they were all the same. They're all centered now and they look great. And because I'm using an external style sheet, I was able to do five pages all at the same time.

Fabulous Robin and Gregg