Help | Site Map
Connecting Tech Pros Worldwide
 
 
LinkBack Thread Tools
  #1  
Old March 9th, 2006, 12:15 PM
Jef Driesen
Guest
 
Posts: n/a
Default Markup table with css?

How can I replace/override the table attributes align, border,
cellpadding and cellspacing with css?
  #2  
Old March 9th, 2006, 12:25 PM
Barbara de Zoete
Guest
 
Posts: n/a
Default Re: Markup table with css?

On Thu, 09 Mar 2006 13:04:40 +0100, Jef Driesen
<jefdriesen@hotmail.com.invalid> wrote:
[color=blue]
> How can I replace/override the table attributes[/color]
[color=blue]
> align,[/color]

table {
text-align:$alignment;
vertical-align:$alignment; }
[color=blue]
> border,[/color]

table, th, td {
border:$length $type $color; }
[color=blue]
> cellpadding[/color]

th, td {
padding:$length_top $length_right $length_bottom $length_left; }
[color=blue]
> and cellspacing[/color]

table {
border-spacing:$length; }

See <URL:http://www.w3.org/TR/CSS2/> and
<URL:http://www.w3.org/TR/REC-CSS2/propidx.html>


--
______PretLetters:
| weblog | http://www.pretletters.net/weblog/weblog.html |
| webontwerp | http://www.pretletters.net/html/webontwerp.html |
|zweefvliegen | http://www.pretletters.net/html/vliegen.html |
  #3  
Old March 9th, 2006, 12:25 PM
Johannes Koch
Guest
 
Posts: n/a
Default Re: Markup table with css?

Barbara de Zoete wrote:
[color=blue]
> On Thu, 09 Mar 2006 13:04:40 +0100, Jef Driesen
> <jefdriesen@hotmail.com.invalid> wrote:
>[color=green]
>> How can I replace/override the table attributes[/color]
>[color=green]
>> align,[/color]
>
> table {
> text-align:$alignment;
> vertical-align:$alignment; }[/color]

Isn't table/@align something like float in CSS?

--
Johannes Koch
In te domine speravi; non confundar in aeternum.
(Te Deum, 4th cent.)
  #4  
Old March 9th, 2006, 12:35 PM
Barbara de Zoete
Guest
 
Posts: n/a
Default Re: Markup table with css?

On Thu, 09 Mar 2006 13:16:58 +0100, Johannes Koch <koch@w3development.de>
wrote:
[color=blue]
> Barbara de Zoete wrote:
>[color=green]
>> On Thu, 09 Mar 2006 13:04:40 +0100, Jef Driesen
>> <jefdriesen@hotmail.com.invalid> wrote:
>>[color=darkred]
>>> How can I replace/override the table attributes[/color]
>>[color=darkred]
>>> align,[/color]
>> table {
>> text-align:$alignment;
>> vertical-align:$alignment; }[/color]
>
> Isn't table/@align something like float in CSS?
>[/color]
I'm not really sure what you mean? Can you exlain a bit further please?


--
______PretLetters:
| weblog | http://www.pretletters.net/weblog/weblog.html |
| webontwerp | http://www.pretletters.net/html/webontwerp.html |
|zweefvliegen | http://www.pretletters.net/html/vliegen.html |
  #5  
Old March 9th, 2006, 12:35 PM
Johannes Koch
Guest
 
Posts: n/a
Default Re: Markup table with css?

Barbara de Zoete wrote:
[color=blue]
> On Thu, 09 Mar 2006 13:16:58 +0100, Johannes Koch
> <koch@w3development.de> wrote:[color=green]
>> Isn't table/@align something like float in CSS?
>>[/color]
> I'm not really sure what you mean? Can you exlain a bit further please?[/color]

I thought, the effect of
<table align="left"> ...
is not the same as
table { text-align: left }
but
table { float: left }
--
Johannes Koch
In te domine speravi; non confundar in aeternum.
(Te Deum, 4th cent.)
  #6  
Old March 9th, 2006, 12:35 PM
Steve Pugh
Guest
 
Posts: n/a
Default Re: Markup table with css?

Jef Driesen <jefdriesen@hotmail.com.invalid> wrote:
[color=blue]
>How can I replace/override the table attributes align, border,
>cellpadding and cellspacing with css?[/color]

align="left" and align="right" are equivalent to float: left; and
float: right; align="center" is equivalent to margin-left: auto;
margin-right: auto; (you must be triggering Standards mode in IE6 for
this last one to work, and it doesn't work at all in IE5).

border is just border. But in CSS the borders on the table and on the
cells are set separately.

cellpaddin is just setting padding on the td and th elements.

cellspacing is border-spacing but hasn't been very well supported in
IE up to now (anyone bothered to check in the IE7 beta yet?) unless
you want to set cellspacing="0" in which case border-collapse:
collapse; has the same effect.

So, something like
<table border="2" cellspacing="2" cellpadding="2" align="center">

would be replicated (with some differnces between browsers) by:
table {
border: 2px outset;
border-spacing: 2px;
border-collapse: separate;
margin-left: auto; margin-right: auto;
}
th, td {
padding: 2px;
border: 1px inset;
}


Steve
--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve@pugh.net> <http://steve.pugh.net/>
  #7  
Old March 9th, 2006, 12:35 PM
Steve Pugh
Guest
 
Posts: n/a
Default Re: Markup table with css?

"Barbara de Zoete" <trashbin@pretletters.net> wrote:[color=blue]
>On Thu, 09 Mar 2006 13:04:40 +0100, Jef Driesen
><jefdriesen@hotmail.com.invalid> wrote:
>[color=green]
>> How can I replace/override the table attributes[/color]
>[color=green]
>> align,[/color]
>
>table {
> text-align:$alignment;
> vertical-align:$alignment; }[/color]

The HTML align attribute when applied to the table element affects the
alignment of the whole table, not the alignment of the text within the
table cells. In other words, table {text-align: right;} is not the
same as <table align="right">.

text-align and vertical-align would be appropriate to replace the
align and valign attributes of td and th.

Steve
--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve@pugh.net> <http://steve.pugh.net/>
  #8  
Old March 9th, 2006, 12:45 PM
Barbara de Zoete
Guest
 
Posts: n/a
Default Re: Markup table with css?

On Thu, 09 Mar 2006 13:23:03 +0100, Johannes Koch <koch@w3development.de>
wrote:
[color=blue]
> Barbara de Zoete wrote:
>[color=green]
>> On Thu, 09 Mar 2006 13:16:58 +0100, Johannes Koch
>> <koch@w3development.de> wrote:[color=darkred]
>>> Isn't table/@align something like float in CSS?
>>>[/color]
>> I'm not really sure what you mean? Can you exlain a bit further please?[/color]
>
> I thought, the effect of
> <table align="left"> ...
> is not the same as
> table { text-align: left }
> but
> table { float: left }[/color]

Looking at Steve's reply too, you're absolutely right. I never knew that
:-)

--
______PretLetters:
| weblog | http://www.pretletters.net/weblog/weblog.html |
| webontwerp | http://www.pretletters.net/html/webontwerp.html |
|zweefvliegen | http://www.pretletters.net/html/vliegen.html |
 

Bookmarks


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
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 Off
[IMG] code is Off
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

What is Bytes?

We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights. Get the best answers to your questions from over network members.
Post your question now . . .
It's fast and it's free

Popular Articles