468,510 Members | 1,735 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,510 developers. It's quick & easy.

How to center a table?

Hi all,

This has got to be a dumb question, but... What is the CSS property that I
would use to center a table on the web page?

If I set the table's Align property in the VS 2008 property window it
inserts align="center" into the <tabletag, and I get a validation warning
that attribute 'align' is considered outdated. Ok, so I probably need to
use a CSS style to do the same thing. But I've dug through all of the
categories in the Modify Style dialog and I can't find anything that sets
alignment or position to "center".

TIA - Bob

Aug 28 '08 #1
8 6991
"Bob Altman" <rd*@nospam.nospamwrote in message
news:er**************@TK2MSFTNGP06.phx.gbl...
This has got to be a dumb question, but... What is the CSS property that I
would use to center a table on the web page?
style="margin-left:auto;margin-right:auto;"
--
Mark Rae
ASP.NET MVP
http://www.markrae.net

Aug 28 '08 #2
"Mark Rae [MVP]" <ma**@markNOSPAMrae.netwrote in message
news:%2****************@TK2MSFTNGP05.phx.gbl...
"Bob Altman" <rd*@nospam.nospamwrote in message
news:er**************@TK2MSFTNGP06.phx.gbl...
>This has got to be a dumb question, but... What is the CSS property that
I would use to center a table on the web page?

style="margin-left:auto;margin-right:auto;"
Thanks Mark. That's seriously non-intuitive!

Bob
Aug 28 '08 #3
CSS works on a "box" model, where each element in your page represents a
"box" of space. Every box has a width, interior padding, and exterior
margins.

By setting the margin-left and margin-right CSS properties to "auto", you
are essentially telling the browser to automatically set the margin for you,
but because you did that on both the left and the right, the individual
margins split the difference and you get a left margin and a right margin
that use up whatever space is not being used by your table "box".

-Scott

"Bob Altman" <rd*@nospam.nospamwrote in message
news:OU**************@TK2MSFTNGP02.phx.gbl...
"Mark Rae [MVP]" <ma**@markNOSPAMrae.netwrote in message
news:%2****************@TK2MSFTNGP05.phx.gbl...
>"Bob Altman" <rd*@nospam.nospamwrote in message
news:er**************@TK2MSFTNGP06.phx.gbl...
>>This has got to be a dumb question, but... What is the CSS property that
I would use to center a table on the web page?

style="margin-left:auto;margin-right:auto;"

Thanks Mark. That's seriously non-intuitive!

Bob

Aug 29 '08 #4
Hi Bob,

You can use the text-align css propety at the parent container element to
perform horizontal alignment setting:

http://www.webmasterworld.com/forum83/4748.htm

http://www.ehow.com/how_2284643_left...align-css.html

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead
Delighting our customers is our #1 priority. We welcome your comments and
suggestions about how we can improve the support we provide to you. Please
feel free to let my manager know what you think of the level of service
provided. You can send feedback directly to my manager at:
ms****@microsoft.com.

==================================================
Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/en-us/subs...#notifications.
==================================================
This posting is provided "AS IS" with no warranties, and confers no rights.

--------------------
>From: "Bob Altman" <rd*@nospam.nospam>
Subject: How to center a table?
Date: Thu, 28 Aug 2008 09:24:41 -0700
>
Hi all,

This has got to be a dumb question, but... What is the CSS property that I
would use to center a table on the web page?

If I set the table's Align property in the VS 2008 property window it
inserts align="center" into the <tabletag, and I get a validation
warning
>that attribute 'align' is considered outdated. Ok, so I probably need to
use a CSS style to do the same thing. But I've dug through all of the
categories in the Modify Style dialog and I can't find anything that sets
alignment or position to "center".

TIA - Bob

Aug 29 '08 #5
Doesn't that property setting inherit into the cells of the table causing
cell data to also be centered (which may not be desired)?

-Scott

"Steven Cheng [MSFT]" <st*****@online.microsoft.comwrote in message
news:ki**************@TK2MSFTNGHUB02.phx.gbl...
Hi Bob,

You can use the text-align css propety at the parent container element to
perform horizontal alignment setting:

http://www.webmasterworld.com/forum83/4748.htm

http://www.ehow.com/how_2284643_left...align-css.html

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead
Delighting our customers is our #1 priority. We welcome your comments and
suggestions about how we can improve the support we provide to you. Please
feel free to let my manager know what you think of the level of service
provided. You can send feedback directly to my manager at:
ms****@microsoft.com.

==================================================
Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/en-us/subs...#notifications.
==================================================
This posting is provided "AS IS" with no warranties, and confers no
rights.

--------------------
>>From: "Bob Altman" <rd*@nospam.nospam>
Subject: How to center a table?
Date: Thu, 28 Aug 2008 09:24:41 -0700
>>
Hi all,

This has got to be a dumb question, but... What is the CSS property that I
would use to center a table on the web page?

If I set the table's Align property in the VS 2008 property window it
inserts align="center" into the <tabletag, and I get a validation
warning
>>that attribute 'align' is considered outdated. Ok, so I probably need to
use a CSS style to do the same thing. But I've dug through all of the
categories in the Modify Style dialog and I can't find anything that sets
alignment or position to "center".

TIA - Bob


Aug 29 '08 #6
Yes, as I suspected, this does not work. It will center the contents of the
table, but not the table itself.

The correct way is as I've described using margin-left:auto and
margin-right:auto.

-Scott
"Scott M." <s-***@nospam.nospamwrote in message
news:ue**************@TK2MSFTNGP02.phx.gbl...
Doesn't that property setting inherit into the cells of the table causing
cell data to also be centered (which may not be desired)?

-Scott

"Steven Cheng [MSFT]" <st*****@online.microsoft.comwrote in message
news:ki**************@TK2MSFTNGHUB02.phx.gbl...
>Hi Bob,

You can use the text-align css propety at the parent container element to
perform horizontal alignment setting:

http://www.webmasterworld.com/forum83/4748.htm

http://www.ehow.com/how_2284643_left...align-css.html

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead
Delighting our customers is our #1 priority. We welcome your comments and
suggestions about how we can improve the support we provide to you.
Please
feel free to let my manager know what you think of the level of service
provided. You can send feedback directly to my manager at:
ms****@microsoft.com.

================================================= =
Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/en-us/subs...#notifications.
================================================= =
This posting is provided "AS IS" with no warranties, and confers no
rights.

--------------------
>>>From: "Bob Altman" <rd*@nospam.nospam>
Subject: How to center a table?
Date: Thu, 28 Aug 2008 09:24:41 -0700
>>>
Hi all,

This has got to be a dumb question, but... What is the CSS property that
I
would use to center a table on the web page?

If I set the table's Align property in the VS 2008 property window it
inserts align="center" into the <tabletag, and I get a validation
warning
>>>that attribute 'align' is considered outdated. Ok, so I probably need to
use a CSS style to do the same thing. But I've dug through all of the
categories in the Modify Style dialog and I can't find anything that sets
alignment or position to "center".

TIA - Bob



Aug 29 '08 #7
Oops, I mean to say that it will center the table AND the contents of the
table, which may not be desired.
"Scott M." <s-***@nospam.nospamwrote in message
news:%2****************@TK2MSFTNGP03.phx.gbl...
Yes, as I suspected, this does not work. It will center the contents of
the table, but not the table itself.

The correct way is as I've described using margin-left:auto and
margin-right:auto.

-Scott
"Scott M." <s-***@nospam.nospamwrote in message
news:ue**************@TK2MSFTNGP02.phx.gbl...
>Doesn't that property setting inherit into the cells of the table causing
cell data to also be centered (which may not be desired)?

-Scott

"Steven Cheng [MSFT]" <st*****@online.microsoft.comwrote in message
news:ki**************@TK2MSFTNGHUB02.phx.gbl...
>>Hi Bob,

You can use the text-align css propety at the parent container element
to
perform horizontal alignment setting:

http://www.webmasterworld.com/forum83/4748.htm

http://www.ehow.com/how_2284643_left...align-css.html

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead
Delighting our customers is our #1 priority. We welcome your comments
and
suggestions about how we can improve the support we provide to you.
Please
feel free to let my manager know what you think of the level of service
provided. You can send feedback directly to my manager at:
ms****@microsoft.com.

================================================ ==
Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/en-us/subs...#notifications.
================================================ ==
This posting is provided "AS IS" with no warranties, and confers no
rights.

--------------------
From: "Bob Altman" <rd*@nospam.nospam>
Subject: How to center a table?
Date: Thu, 28 Aug 2008 09:24:41 -0700
Hi all,

This has got to be a dumb question, but... What is the CSS property that
I
would use to center a table on the web page?

If I set the table's Align property in the VS 2008 property window it
inserts align="center" into the <tabletag, and I get a validation
warning
that attribute 'align' is considered outdated. Ok, so I probably need
to
use a CSS style to do the same thing. But I've dug through all of the
categories in the Modify Style dialog and I can't find anything that
sets
alignment or position to "center".

TIA - Bob



Aug 29 '08 #8
Thanks for your followup Scott,

Yes, I think your suggestion is reasonable. Using Margin will be preferred.

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead
Delighting our customers is our #1 priority. We welcome your comments and
suggestions about how we can improve the support we provide to you. Please
feel free to let my manager know what you think of the level of service
provided. You can send feedback directly to my manager at:
ms****@microsoft.com.

--------------------
>From: "Scott M." <s-***@nospam.nospam>
Subject: Re: How to center a table?
Date: Fri, 29 Aug 2008 19:30:04 -0400
>
Oops, I mean to say that it will center the table AND the contents of the
table, which may not be desired.
"Scott M." <s-***@nospam.nospamwrote in message
news:%2****************@TK2MSFTNGP03.phx.gbl...
>Yes, as I suspected, this does not work. It will center the contents of
the table, but not the table itself.

The correct way is as I've described using margin-left:auto and
margin-right:auto.

-Scott
"Scott M." <s-***@nospam.nospamwrote in message
news:ue**************@TK2MSFTNGP02.phx.gbl...
>>Doesn't that property setting inherit into the cells of the table
causing
>>cell data to also be centered (which may not be desired)?

-Scott

"Steven Cheng [MSFT]" <st*****@online.microsoft.comwrote in message
news:ki**************@TK2MSFTNGHUB02.phx.gbl.. .
Hi Bob,

You can use the text-align css propety at the parent container element
to
perform horizontal alignment setting:

http://www.webmasterworld.com/forum83/4748.htm

Sep 1 '08 #9

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

1 post views Thread by Richard | last post: by
3 posts views Thread by lovely_angel_for_you | last post: by
7 posts views Thread by Jeff | last post: by
3 posts views Thread by dubing | last post: by
3 posts views Thread by RubbedLung | last post: by
reply views Thread by NPC403 | last post: by
1 post views Thread by fmendoza | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.