Whats the new way to center a table

[Bjoern Wolfgardt]

Hi,

I have read the you should no longer use 'align="center" ' when you
want to center a table or something other.
So I asked myself what should I use than. I found something that you
should use styles. But they used a attribute that is only for text
elements.
So can someone give me an example or an url where I can find further
information.

I first discovered this problem while testing my application with
Mozilla 1.3.1. The align=center for my tables had no effect. When I
put the table in a <div align=center> than all works fine.

cu
Bjoern

[Geoff Ball]

Bjoern Wolfgardt <14************ *************@p osting.google.c om> wrote in
comp.infosystem s.www.authoring.html:

I have read the you should no longer use 'align="center" ' when you
want to center a table or something other.
So I asked myself what should I use than. I found something that you
should use styles. But they used a attribute that is only for text
elements.
So can someone give me an example or an url where I can find further
information.

http://stone.thecoreworlds.net/www/centre/

Regards,
Geoff

--
http://www.allmyfaqs.com/faq.pl?Geoff_Ball
http://www.allmyfaqs.com/faq.pl?Web_Core_References
http://www.allmyfaqs.com/faq.pl?How_to_post

[Stan Brown]

In article <14************ *************@p osting.google.c om> in
comp.infosystem s.www.authoring.html, Bjoern Wolfgardt
<aa*****@gmx.de > wrote:

can someone give me an example or an url where I can find further
information.

http://theodorakis.net/tablecentertest.html

It's the goods!

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
validator: http://jigsaw.w3.org/css-validator/

[Headless]

Stan Brown <th************ @fastmail.fm> wrote:

http://stone.thecoreworlds.net/www/centre/

That's a lovely resource, but it doesn't actually answer the
question. :-(

It does, but this is a question that cannot be answered in
straightforward way as it depends on a number of variables (doctype,
<IE6 etc.>.

The page answers the question by explaining how it works in the "Teach a
man to fish" tradition.
Headless

[Bjoern Wolfgardt]

LOL...

Web development is so confusing.

The CSS Way works fine with Mozilla. But not with IE 6. And Mozilla
doesn't use the align=center attribute but IE 6 does.

I think I will use both like this:
<table align=center style="MARGIN-LEFT:auto;MARGI N-RIGHT:auto"
border="1">

cu
Bjoern Wolfgardt

Stan Brown <th************ @fastmail.fm> wrote in message news:<MP******* *************** **@news.odyssey .net>...

In article <14************ *************@p osting.google.c om> in
comp.infosystem s.www.authoring.html, Bjoern Wolfgardt
<aa*****@gmx.de > wrote:

can someone give me an example or an url where I can find further
information.

http://theodorakis.net/tablecentertest.html

It's the goods!

[David Dorward]

Stan Brown wrote:

In article <1234666.PYKUYF uaPT@geoffball> in
comp.infosystem s.www.authoring.html, Geoff Ball <ge********@sha w.ca>
wrote:

http://stone.thecoreworlds.net/www/centre/

That's a lovely resource, but it doesn't actually answer the
question. :-(

Really?

Quote:
Block level content includes such elements as <h1>, <h2>, <p>, <table> (but
^^^^^
see IE Bugs), and <div>. To centre block level elements...

--
David Dorward http://david.us-lot.org/

[David Dorward]

Bjoern Wolfgardt wrote:

Please direct your attention to: http://www.allmyfaqs.com/faq.pl?How_to_post

The CSS Way works fine with Mozilla. But not with IE 6. And Mozilla
doesn't use the align=center attribute but IE 6 does. I think I will use both like this:
<table align=center style="MARGIN-LEFT:auto;MARGI N-RIGHT:auto"
border="1">

MSIE is broken. You have to force it in to standards mode or take further
steps to centre block level content in it. See:
http://david.us-lot.org/www/centre/#ie

--
David Dorward http://david.us-lot.org/

[Stan Brown]

In article <bf************ *******@news.de mon.co.uk> in
comp.infosystem s.www.authoring.html, David Dorward
<do*****@yahoo. com> wrote:

Stan Brown wrote:

In article <1234666.PYKUYF uaPT@geoffball> in
comp.infosystem s.www.authoring.html, Geoff Ball <ge********@sha w.ca>
wrote:

http://stone.thecoreworlds.net/www/centre/

That's a lovely resource, but it doesn't actually answer the
question. :-(

Really?

Quote:
Block level content includes such elements as <h1>, <h2>, <p>, <table> (but
^^^^^
see IE Bugs), and <div>. To centre block level elements...

My apologies. I overlooked that.

I think Nick Theodorakis' page is much better for the OP's question
because it goes much more thoroughly into the specific issues of
tables, but I agree that the stone page does mention tables.

I think there is one problem with the suggested solution, which was

<div style="text-align: center;">
<div style="text-align: left; margin: 1em auto; width: 50%;">
</div>
</div>

When centering a table, if you do

<div style="text-align: center;">
<table style="text-align: left; margin: 1em auto; width: 50%;">
</table>
</div>

then doesn't that cause the <th> elements also to be left aligned,
by inheritance?

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
validator: http://jigsaw.w3.org/css-validator/

[David Dorward]

Stan Brown wrote:

I think Nick Theodorakis' page is much better for the OP's question
because it goes much more thoroughly into the specific issues of
tables, but I agree that the stone page does mention tables.
Other then the <th> issue you mention below, there aren't any table specific
issues (at least with CSS centring methods). They are just block level
elements.
When centering a table, if you do

<div style="text-align: center;">
<table style="text-align: left; margin: 1em auto; width: 50%;">
</table>
</div>

then doesn't that cause the <th> elements also to be left aligned,
by inheritance?

Nothing preventing you from having:

..tableWrapper { text-align: center; }
table { text-align: left; margin: auto 1em; }
th { text-align: center; }
--
David Dorward http://david.us-lot.org/

[Stan Brown]

In article <bf************ *******@news.de mon.co.uk> in
comp.infosystem s.www.authoring.html, David Dorward
<do*****@yahoo. com> wrote:

Nothing preventing you from having:

.tableWrappe r { text-align: center; }
table { text-align: left; margin: auto 1em; }
th { text-align: center; }

Agreed -- my point was that the page doesn't even raise the issue
and someone who posts "how do I center a table?" isn't likely to
guess that it's needed.

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
validator: http://jigsaw.w3.org/css-validator/