Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > centering and css

Reply
Thread Tools

centering and css

 
 
Mopar
Guest
Posts: n/a
 
      12-01-2003
This is my first post, so I'll try to get right to the point.
I'm attempting my first site using css to make tables, but so far there's
one irritating glitch.
I'd like to have the tables centered but not the text inside the table.
Any help is very appreciated.

http://members.shaw.ca/casper99/test/1_15.htm

Cheers
99man




 
Reply With Quote
 
 
 
 
brucie
Guest
Posts: n/a
 
      12-01-2003
in post <news:asByb.534866$pl3.42@pd7tw3no>
Mopar said:

> I'd like to have the tables centered but not the text inside the table.
> Any help is very appreciated.
>
> http://members.shaw.ca/casper99/test/1_15.htm


there are no tables there and there are so many issues with your
html/css i don't know where to start except again.

nice and easy:

<style type="text/css">
p{width:50%;margin:auto;border:1px solid green;}
</style>

<p>blah</p>

the <p> will be 50% the width of the canvas area. the margins are 'auto'
which means they'll be of equal size, as the width of the <p> is 50% the
left and right margins will be 25% thus centering the <p>. the text is
left aligned which is [usually] the default. there is a nice green
border around the <p> so you can see it.

--
brucie
01/December/2003 05:24:28 pm kilo
 
Reply With Quote
 
 
 
 
Toby A Inkster
Guest
Posts: n/a
 
      12-01-2003
Mopar wrote:

> I'd like to have the tables centered but not the text inside the table.
> Any help is very appreciated.


table { margin: auto; }

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

 
Reply With Quote
 
Nick Howes
Guest
Posts: n/a
 
      12-01-2003

"Toby A Inkster" <> wrote in message
news. ..
> Mopar wrote:
>
> > I'd like to have the tables centered but not the text inside the table.
> > Any help is very appreciated.

>
> table { margin: auto; }
>
> --
> Toby A Inkster BSc (Hons) ARCS
> Contact Me - http://www.goddamn.co.uk/tobyink/?page=132
>


That's all good CSS except for internet explorer won't do it. You'll also
have to do something like, surround the table in a DIV with "text-align:
center" which will make ie center the contents in the window, and then add
"text-align: left" so that the text centering doesn't cascade down to the
text inside the table. There's other ways like adding a negative margin but
i think this is the simpelst best way.

--
Nick



 
Reply With Quote
 
brucie
Guest
Posts: n/a
 
      12-01-2003
in post <news:bqeu4r$1jl$>
Nick Howes said:

>> table { margin: auto; }


> That's all good CSS except for internet explorer won't do it.


yes it will
http://stuff.bruciesusenetshit.info/...le-thingy.html



--
brucie
01/December/2003 06:33:36 pm kilo
 
Reply With Quote
 
DU
Guest
Posts: n/a
 
      12-01-2003
Nick Howes wrote:
> "Toby A Inkster" <> wrote in message
> news. ..
>
>>Mopar wrote:
>>
>>
>>>I'd like to have the tables centered but not the text inside the table.
>>>Any help is very appreciated.

>>
>>table { margin: auto; }
>>
>>--
>>Toby A Inkster BSc (Hons) ARCS
>>Contact Me - http://www.goddamn.co.uk/tobyink/?page=132
>>

>
>
> That's all good CSS except for internet explorer won't do it. You'll also
> have to do something like, surround the table in a DIV with "text-align:
> center" which will make ie center the contents in the window, and then add
> "text-align: left" so that the text centering doesn't cascade down to the
> text inside the table. There's other ways like adding a negative margin but
> i think this is the simpelst best way.
>



All he has to do is remove the xml declaration. MSIE 6 for windows
expects to see the doctype declaration (which can trigger standards
compliant rendering mode) at the very first line of a document. Here,
the xml declaration creates a conflict; it's really an MSIE 6 bug.

"An XML declaration is not required in all XML documents; however XHTML
document authors are strongly encouraged to use XML declarations in all
their documents."
http://www.w3.org/TR/2002/REC-xhtml1-20020801/#strict

11.3 Table formatting by visual user agents
11.3.2 Horizontal and vertical alignment
Inheritance of alignment specifications
"The default alignment for cells depends on the user agent. However,
user agents should substitute the default attribute for the current
directionality (i.e., not just 'left' in all cases)."
http://www.w3.org/TR/html401/struct/...tml#h-11.3.2.1

If you insert the "direction:rtl;" css rule to the body or html tag,
you'll see that not only the text is formatted from right to left but
the horizontal alignment formating is right aligned as well.

W3C CSS level 1
4 Formatting model
4.1.2 Horizontal formatting
"(...) if both 'margin-left' and 'margin-right' are 'auto', they will be
set to equal values. This will center the element inside its parent."
http://www.w3.org/TR/REC-CSS1#horizontal-formatting

W3C CSS level 2
10 Visual formatting model details
10.3.3 Block-level, non-replaced elements in normal flow
"If both 'margin-left' and 'margin-right' are 'auto', their computed
values are equal."
http://www.w3.org/TR/REC-CSS2/visudet.html#q6

Interactive complete demo on table alignment (table, cell, text
direction, row, column, caption):
http://www10.brinkster.com/doctorunc...ormatting.html

As others mentioned, if you want to format the horizontal alignment of
data inside cells, then use the CSS property text-align:[left|center|right]
E.g.: table {text-align:left;}

DU

 
Reply With Quote
 
Brian Tozer
Guest
Posts: n/a
 
      12-01-2003
brucie wrote:
> in post <news:bqeu4r$1jl$>
> Nick Howes said:
>
>>> table { margin: auto; }

>
>> That's all good CSS except for internet explorer won't do it.

>
> yes it will
> http://stuff.bruciesusenetshit.info/...le-thingy.html


Am I correct in assuming that versions of IE that are earlier than IE6 would
not?

Brian Tozer


 
Reply With Quote
 
brucie
Guest
Posts: n/a
 
      12-01-2003
in post <news:bqfve1$mqk$>
Brian Tozer said:

>> yes it will
>> http://stuff.bruciesusenetshit.info/...le-thingy.html


> Am I correct in assuming that versions of IE that are earlier than IE6 would
> not?


it wouldn't surprise me. IE6 is over 2 years old - ancient. IE5 is
getting close to 5 years old - prehistoric.

--
brucie
02/December/2003 08:29:42 am kilo
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Centering whole page in CSS Scott HTML 3 07-18-2004 12:01 AM
CSS centering Will HTML 11 04-29-2004 01:50 AM
Centering with CSS somebody HTML 13 01-23-2004 10:17 AM
css fixed position and scrolling, centering tables steffen.mazanek@unibw-muenchen.de HTML 5 10-27-2003 03:40 PM
Centering content horizontally AND vertically with CSS? Lenny HTML 1 10-15-2003 11:14 PM



Advertisments