Forum Moderators: not2easy
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<style type="text/css">
table {
margin-right:auto;
margin-left:auto;
}
</style>
</head>
<body>
<table><tr><td valign='top'>
<p>this</p>
</td><td valign='top'>
<p>is</p>
</td></tr><tr><td valign='top'>
<p>a</p>
</td><td valign='top'>
<p>table</p>
</td></tr>
</table>
</body>
</html>
Thanks,
Phil
<center>
<table>
<tr>
<td valign='top'>this</td>
<td valign='top'>is</td>
</tr>
<tr>
<td valign='top'>a</td>
<td valign='top'>table</td>
</tr>
</table>
</center>
With no width's set on the TABLE, it may open to full width of body, or tighten down to width of maximum space of longest line of cells depending on browser.
I usually set "border="1" inside the <TABLE> tag to troubleshoot, ie-
<table border="1">
then you can actually see what's happening. Aside from width, you also have cellspacing and cellpadding to deal with...
lexipixel:
"Don't know what the <P> tags or the CSS for table were doing for you.."
I'm using wiki software that allows users to create webpages and the <p> tags are automatically inserted, so when I recreated it in an off-line HTML file I went ahead and left them in (though it's not how I would write it myself). I know I can style tables in HTML, but I'm trying to do it with CSS.
I've come across several resources that say that the way to center tables with CSS is to use:
table {
margin-left:auto;
margin-right:auto;
}
I have not come across any other technique, and this one isn't working. It seems a simple thing...
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
and what I needed was:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
I was so busy looking at the CSS that I didn't think to check the doctype. I can't believe I just spent 2 hours on that.
A short rant:
I think it's pretty weird that you have to use "table {margin-left:auto; margin-right:auto;}" to center a table. That seems more like a hack to me, or a work-around. What's wrong with just "table {align:center;}" or "table {halign:center;}"? I guess the w3c has their reasons...