Prev: Sprites for screen readers
Next: Center Table using CSS
From: Camille Petersen on 13 Feb 2010 10:28
When I inspect a CSS I found entries of the kind

TABLE TD { .... }

Mind the blank betwen the two tags! What does that mean?
Do all following instructions apply to the list of tags before?

I thought such a list will be concatenated by commas.

Furthermore I would like to setup a margin before (=to the top/north) of a TABLE.
Can I simply write

margintop: 20px;

Or how do I specify it otherwise?

Camille

From: John Dunlop on 13 Feb 2010 10:45
Camille Petersen:

> When I inspect a CSS I found entries of the kind
>
> TABLE TD { .... }
>
> Mind the blank betwen the two tags! What does that mean?

The selector "TABLE TD" matches any TD element that is a descendant of a
TABLE element.

http://www.w3.org/TR/CSS21/selector.html#descendant-selectors

> Do all following instructions apply to the list of tags before?

No.

> I thought such a list will be concatenated by commas.

That's right.

> Furthermore I would like to setup a margin before (=to the top/north) of
> a TABLE. Can I simply write
>
> margintop: 20px;

The property name is "margin-top".

If the selector is TABLE, the property "margin-top", and the value 1em,
the rule would be

TABLE { margin-top : 1em }

--
John
From: Jukka K. Korpela on 13 Feb 2010 10:49
Camille Petersen wrote:

> TABLE TD { .... }
>
> Mind the blank betwen the two tags! What does that mean?

It means nesting. TABLE TD matches those TD elements that appear inside a
TABLE element. Of course, by HTML syntax, TD elements are only allowed
inside a TABLE element. However, the selector TABLE TD has higher
specificity than TD, and this may matter in the cascade.

Ref.: http://www.w3.org/TR/CSS2/selector.html#descendant-selectors

> Do all following instructions apply to the list of tags before?

No.

> I thought such a list will be concatenated by commas.

TABLE,TD (or equivalently TABLE, TD) would indeed match all TABLE elements
and all TD elements.

> Furthermore I would like to setup a margin before (=to the top/north)
> of a TABLE. Can I simply write
>
> margintop: 20px;

It must be
margin-top: 20px;
with a hyphen. The hyphen is part of the property name.

It is generally better to use the em unit than the px unit, e.g.

table { margin-top: 1.5em; }

--
Yucca, http://www.cs.tut.fi/~jkorpela/

From: Hans-Georg Michna on 13 Feb 2010 18:31
On 13 Feb 2010 15:28:16 GMT, Camille Petersen wrote:

>When I inspect a CSS I found entries of the kind
>
>TABLE TD { .... }
>
>Mind the blank betwen the two tags! What does that mean?

It means that this holds for all TD elements that are somewhere
inside TABLE elements. In other words, it is nonsense, because
TD elements are only allowed somewhere inside TABLE elements
anyway. The author didn't know what he was doing. Write this
instead:

TD { ... }

>Do all following instructions apply to the list of tags before?

Yes. Read
http://www.w3.org/TR/2009/CR-CSS2-20090908/selector.html .

>I thought such a list will be concatenated by commas.

That means something different. See above.

>Furthermore I would like to setup a margin before (=to the top/north) of a TABLE.
>Can I simply write
>
>margintop: 20px;
>
>Or how do I specify it otherwise?

table { margin-top: 20px; }

I think you should use a CSS reference, rather than asking here
for basics. That's certainly faster and doesn't waste other
peoples' time.

The newsgroup is better if you have a specific problem and
cannot find the answer anywhere else.

Hans-Georg
From: Jukka K. Korpela on 14 Feb 2010 02:58
Hans-Georg Michna wrote:

>> TABLE TD { .... }
- -
> It means that this holds for all TD elements that are somewhere
> inside TABLE elements.

As several people have responded, in different wordings.

> In other words, it is nonsense, because
> TD elements are only allowed somewhere inside TABLE elements
> anyway.

No, as I wrote before, it has higher specificity than TD. This means that it
can be used to override settings in a TD { ... } rule.

Moreover, although the OP probably saw this in a stylesheet for an HTML
document, a stylesheet as such is not restricted to being applied to HTML
documents.

> I think you should use a CSS reference, rather than asking here
> for basics. That's certainly faster and doesn't waste other
> peoples' time.

It is certainly faster to most people to start from a _tutorial_ rather than
a reference. The problem is that there are so many cluessless tutorials
around, written by people who should have read a tutorial first. Actually, I
don't know any really good tutorial. Even Dave Ragget's good old
http://www.w3.org/MarkUp/Guide/Style
has fundamental flaws, like using Transitional doctype (mostly a matter of
principle, but why use it in a simple document supposed to contain little
but styling examples!!), using Verdana for body in an example, and setting
color without setting background. And it uses very simple selectors, which
is fine in a primer, but doesn't take you very far.

--
Yucca, http://www.cs.tut.fi/~jkorpela/

 |  Next  |  Last
Pages: 1 2 3
Prev: Sprites for screen readers
Next: Center Table using CSS