Centering a Table

11/04/2008, 19h07

I have a simple (?) page that has only a table as its content (I
suppose I could do it some other way, but I'm unsure of how...). I want
the table to be centered on the page. It works with I.E., but fails
with other browsers (FF, SeaMonkey, etc.): it aligns on the left part of
the page.
Apart from of the annoying differences with I.E. and other browsers,
what can I do to assure the table's data is centered on the rendered
page? TIA
http://mrcccs.890m.com/RHContact.html

11/04/2008, 19h44

replace Q with c Mike Copeland wrote:
> I have a simple (?) page that has only a table as its content (I
> suppose I could do it some other way, but I'm unsure of how...). I want
> the table to be centered on the page. It works with I.E., but fails
> with other browsers (FF, SeaMonkey, etc.): it aligns on the left part of
> the page.
> Apart from of the annoying differences with I.E. and other browsers,
> what can I do to assure the table's data is centered on the rendered
> page? TIA
> http://mrcccs.890m.com/RHContact.html
>

Tables are block elements, you center blocks of smaller width within
other blocks by setting the left and right margins to "auto". You do not
use "text-align: center" that is for alignment of inline text....

table { margin-left: auto; margin-right: auto; }

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

11/04/2008, 23h49

> replace Q with c Mike Copeland wrote:
> > I have a simple (?) page that has only a table as its content (I
> > suppose I could do it some other way, but I'm unsure of how...). I want
> > the table to be centered on the page. It works with I.E., but fails
> > with other browsers (FF, SeaMonkey, etc.): it aligns on the left part of
> > the page.
> > Apart from of the annoying differences with I.E. and other browsers,
> > what can I do to assure the table's data is centered on the rendered
> > page? TIA
> > http://mrcccs.890m.com/RHContact.html
>
> Tables are block elements, you center blocks of smaller width within
> other blocks by setting the left and right margins to "auto". You do not
> use "text-align: center" that is for alignment of inline text....
>
> table { margin-left: auto; margin-right: auto; }
>
I tried that, but it doesn't change any of the rendering behavior:
I.E. works, but other browsers don't.
I also removed the "text-align: center", but that made I.E. fail,
too.
It seems I didn't understand your message: could you show what code
is to be changed and where to implement the changes? TIA

12/04/2008, 03h28

Mike Copeland wrote:

[replaced attribute] Jonathan wrote:

>> table { margin-left: auto; margin-right: auto; }
>>
> I tried that, but it doesn't change any of the rendering behavior:
> I.E. works, but other browsers don't.
> I also removed the "text-align: center", but that made I.E. fail,
> too.
> It seems I didn't understand your message: could you show what code
> is to be changed and where to implement the changes? TIA

Then you are doing something wrong.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta http-equiv="content-language" content="en-us">
<title>Centering blocks</title>

<style type="text/css">
table { margin: 1em auto; border: 1px solid #000; }
td { border: 1px solid #aaa; }
</style>

</head>
<body>
<table>
<tr><td>I am in the center of the browser window</td></tr>
<tr><td>Even works in IE6.x +</td></tr>
</table>
</body>
</html>

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

11/04/2008, 19h07	#1
replace Q with c Messages: n/a Hébergeur:	Centering a Table I have a simple (?) page that has only a table as its content (I suppose I could do it some other way, but I'm unsure of how...). I want the table to be centered on the page. It works with I.E., but fails with other browsers (FF, SeaMonkey, etc.): it aligns on the left part of the page. Apart from of the annoying differences with I.E. and other browsers, what can I do to assure the table's data is centered on the rendered page? TIA http://mrcccs.890m.com/RHContact.html

11/04/2008, 19h44	#2
Jonathan N. Little Messages: n/a Hébergeur:	Re: Centering a Table replace Q with c Mike Copeland wrote: > I have a simple (?) page that has only a table as its content (I > suppose I could do it some other way, but I'm unsure of how...). I want > the table to be centered on the page. It works with I.E., but fails > with other browsers (FF, SeaMonkey, etc.): it aligns on the left part of > the page. > Apart from of the annoying differences with I.E. and other browsers, > what can I do to assure the table's data is centered on the rendered > page? TIA > http://mrcccs.890m.com/RHContact.html > Tables are block elements, you center blocks of smaller width within other blocks by setting the left and right margins to "auto". You do not use "text-align: center" that is for alignment of inline text.... table { margin-left: auto; margin-right: auto; } -- Take care, Jonathan ------------------- LITTLE WORKS STUDIO http://www.LittleWorksStudio.com

11/04/2008, 23h49	#3
Mike Copeland Messages: n/a Hébergeur:	Re: Centering a Table > replace Q with c Mike Copeland wrote: > > I have a simple (?) page that has only a table as its content (I > > suppose I could do it some other way, but I'm unsure of how...). I want > > the table to be centered on the page. It works with I.E., but fails > > with other browsers (FF, SeaMonkey, etc.): it aligns on the left part of > > the page. > > Apart from of the annoying differences with I.E. and other browsers, > > what can I do to assure the table's data is centered on the rendered > > page? TIA > > http://mrcccs.890m.com/RHContact.html > > Tables are block elements, you center blocks of smaller width within > other blocks by setting the left and right margins to "auto". You do not > use "text-align: center" that is for alignment of inline text.... > > table { margin-left: auto; margin-right: auto; } > I tried that, but it doesn't change any of the rendering behavior: I.E. works, but other browsers don't. I also removed the "text-align: center", but that made I.E. fail, too. It seems I didn't understand your message: could you show what code is to be changed and where to implement the changes? TIA

12/04/2008, 03h28	#4
Jonathan N. Little Messages: n/a Hébergeur:	Re: Centering a Table Mike Copeland wrote: [replaced attribute] Jonathan wrote: >> table { margin-left: auto; margin-right: auto; } >> > I tried that, but it doesn't change any of the rendering behavior: > I.E. works, but other browsers don't. > I also removed the "text-align: center", but that made I.E. fail, > too. > It seems I didn't understand your message: could you show what code > is to be changed and where to implement the changes? TIA Then you are doing something wrong. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <meta http-equiv="content-language" content="en-us"> <title>Centering blocks</title> <style type="text/css"> table { margin: 1em auto; border: 1px solid #000; } td { border: 1px solid #aaa; } </style> </head> <body> <table> <tr><td>I am in the center of the browser window</td></tr> <tr><td>Even works in IE6.x +</td></tr> </table> </body> </html> -- Take care, Jonathan ------------------- LITTLE WORKS STUDIO http://www.LittleWorksStudio.com

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email