Welcome to WebmasterWorld Guest from 23.22.46.195

Forum Moderators: not2easy

Another 'aligning problem'

trying to align table in center of page using css

   
12:15 pm on Oct 24, 2002 (gmt 0)

10+ Year Member



Hi Guys,

I'd really appreciate your help with regards to aligning a table to the center of the page using css.
Using the code :

div.align {
text-align: center;
}

It works fine with a pc but not on a mac.Also showing up on netscape aligned to the left.

I'm trying to keep the code validated with xhtml and would prefer not to have to use <table align ="center">

Thanks,
Barry

3:16 pm on Oct 24, 2002 (gmt 0)

10+ Year Member



Set the left and right margins on the table to "auto", eg. style="margin: 0 auto;".

This works in standards-compliant browsers so in combination with your solution you're covered.

3:20 pm on Oct 24, 2002 (gmt 0)

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



Hi try adding...

{
margin-left: 20%
margin-right: 20%
text-align: center;
}

or{margin: 0 20%; text-align: center;} /* the shorthand version */

...to the text-align property you have already set, this may work, you can adjust the % value as it will depend on how big your table is in regard to the page I have used this before on tables with some success

Suzy

3:22 pm on Oct 24, 2002 (gmt 0)

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



Hi sorry LHG, we crossed in "post"

btw....I can never get auto to work!

I just tested and, it doesn't in NS, Opera

;)
Suzy

3:39 pm on Oct 24, 2002 (gmt 0)

10+ Year Member



Suzy

You may have an older version of Opera. "margin: auto" works in the current version, in older versions you had to specify left and right separately, ie "margin-left: auto; margin-right: auto;"

div {text-align: centre;} works in NS4, so one way or another it is possible to cover all the bases with valis css.

3:56 pm on Oct 24, 2002 (gmt 0)

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



Have you tried <div align="center"> in your code? Does that validate and work?

<div align="center">
<table border="0" cellpadding="0" cellspacing="0">...

4:04 pm on Oct 24, 2002 (gmt 0)

10+ Year Member



HI Guys,

Thanks for responses

Worked a treat with the code Suzy gave me.
The margin attribute was the key: margin: 0 20%;
Well done Suzy, I really appreciate it !

Have you tried <div align="center"> in your code? Does that validate and work?

This would work but would'nt validate with xhtml.
The tag has been depreciated in html 4.01, so it is on the way out.

Thanks again,
Barry

 

Featured Threads

My Threads

Hot Threads This Week

Hot Threads This Month