This is Interesting: Free Magazines for Graphics designers and webmasters  


Home > Archive > Stylesheets > June 2004 > basic descendant selector question





You are viewing an archived Text-only version of the thread. To view this thread in it's original format and/or if you want to reply to this thread please [click here]

Author basic descendant selector question
Laurence Tureaud

2004-06-17, 4:18 am

hello

i'm just getting started with CSS & am reading through Eric Meyer on
CSS, specifically the first chapter.

he creates these styles:

td#advert {stuff}
#content-top td { stuff }
tr td#sidetop {stuff }

so my questions....

1. can i shorten td#advert to just #advert?

2. can i shorten tr td#sidetop to just #sidetop?

tia -
Mr T.
Owen Jacobson

2004-06-17, 4:18 am

On Wed, 16 Jun 2004 19:11:51 -0700, Laurence Tureaud wrote:

> hello
>
> i'm just getting started with CSS & am reading through Eric Meyer on
> CSS, specifically the first chapter.
>
> he creates these styles:
>
> td#advert {stuff}
> #content-top td { stuff }
> tr td#sidetop {stuff }
>
> so my questions....
>
> 1. can i shorten td#advert to just #advert?


Yes, but it's only recommended if either the holder of the 'advert' ID
will never change or all the styles are relevant to any possible 'advert'
element. Keep in mind an ID may be used more than once on different pages.

> 2. can i shorten tr td#sidetop to just #sidetop?


Decide for yourself by working out which elements on which pages the
former and the latter select and then determining if the difference is
relevant.

--
Some say the Wired doesn't have political borders like the real world,
but there are far too many nonsense-spouting anarchists or idiots who
think that pranks are a revolution.

Brian

2004-06-17, 4:18 am

Laurence Tureaud wrote:

> td#advert {stuff}
> #content-top td { stuff }
> tr td#sidetop {stuff }
>
> 1. can i shorten td#advert to just #advert?


This depends on the context. td#advert selects only <td> elements
whose id="advert", while #advert selects any element whose
id="advert". Will another page have <div id="advert">? Do you want the
style to apply to both?

> 2. can i shorten tr td#sidetop to just #sidetop?


I'm not sure about the point of tr. A <td> element is *always* a
descendent of <tr>, so it seems superfluous. But beyond that, the same
question applies. What do you want to style? <td id="sidetop">? Or any
element whose id="sidetop"?

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Laurence Tureaud

2004-06-17, 4:18 am

On Thu, 17 Jun 2004 02:14:22 GMT, Owen Jacobson
<angstrom@lionsanctuary.net> wrote:

>
> Yes, but it's only recommended if either the holder of the 'advert' ID
> will never change or all the styles are relevant to any possible 'advert'
> element. Keep in mind an ID may be used more than once on different
> pages.

aha.. but an ID should be used only once on any given page, right?
because a book i'm reading "dreamweaver 2004 mx missing manual" says an
ID is for formatting a unique item on a page.

I understand what you say about multiple pages though.

thanks-
matt
Harlan Messinger

2004-06-17, 4:18 am

pitythefool@XXXXXXXXXX (Laurence Tureaud) wrote:

>hello
>
> i'm just getting started with CSS & am reading through Eric Meyer on
>CSS, specifically the first chapter.
>
>he creates these styles:
>
>td#advert {stuff}
>#content-top td { stuff }
>tr td#sidetop {stuff }
>
>so my questions....
>
>1. can i shorten td#advert to just #advert?


Yes, if the element with id="advert" on your pages is always a TD.

>
>2. can i shorten tr td#sidetop to just #sidetop?


Likewise. The tr seems especially pointless since you can't have a TD
that isn't inside a TR.

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ๔ter le premier point de mon adresse de courriel.
Harlan Messinger

2004-06-17, 4:18 am

"Laurence Tureaud" <pitythefool@XXXXXXXXXX> wrote:

>On Thu, 17 Jun 2004 02:14:22 GMT, Owen Jacobson
><angstrom@lionsanctuary.net> wrote:
>
>aha.. but an ID should be used only once on any given page, right?


Right.


--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ๔ter le premier point de mon adresse de courriel.
Laurence Tureaud

2004-06-17, 4:19 am

ok good. i think i'm getting this stuff.

> This depends on the context. td#advert selects only <td> elements whose
> id="advert", while #advert selects any element whose id="advert". Will
> another page have <div id="advert">? Do you want the style to apply to
> both?

but wouldn't it be a bit sloppy to use the same id name in different
places?

are there any performance related issues with either approach? i thought
maybe using a more specific path would speed the application of the style.

thanks again-
matt
Brian

2004-06-17, 4:19 am

Laurence Tureaud wrote:

> an ID should be used only once on any given page, right?


Yes. But it can be used on a different page on the same site, and both
pages could (and normally would) use the same stylesheet.

> a book i'm reading "dreamweaver 2004 mx missing manual" says an
> ID is for formatting a unique item on a page.


Well that definition seems rather limiting. The id attribute is meant
to be used as a fragment identifier for urls; it can also be used in
css selectors, in javascript, and probably for other things I cannot
think of. You might want to find something more reliable than a
Dreamweaver manual to explain www terminology.

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Brian

2004-06-17, 4:19 am

Laurence Tureaud wrote:

> ok good. i think i'm getting this stuff.
>
>
> wouldn't it be a bit sloppy to use the same id name in different
> places?


No, not at all. It's nearly ubiquitous for every page of a site to
have a navigation section, and quite common for the container of said
navigation to have id="nav" or something similar, on every page of the
site.

> are there any performance related issues with either approach? i thought
> maybe using a more specific path would speed the application of the style.


I know of no studies to suggest any difference in document rendering
by using id instead of, say, class or element selector.

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Barry Pearson

2004-06-17, 7:15 am

Laurence Tureaud wrote:
> hello
>
> i'm just getting started with CSS & am reading through Eric Meyer on
> CSS, specifically the first chapter.
>
> he creates these styles:
>
> td#advert {stuff}
> #content-top td { stuff }
> tr td#sidetop {stuff }

[snip]

You've received lots of good answers. But I wonder if there is something more?
Have a look at these posts by Eric in response to queries like this elsewhere.
(It is to do with maximising specificity in certain cases).

http://groups.google.com/groups?sel....macromedia.com

http://groups.google.com/groups?sel....macromedia.com

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/


Barry Pearson

2004-06-17, 12:15 pm

Brian wrote:
> Laurence Tureaud wrote:

[snip]
>
> I'm not sure about the point of tr. A <td> element is *always* a
> descendent of <tr>, so it seems superfluous.

[snip]

I'll answer that specific point. Suppose you have a table (and conforming
browsers):

<table><tr><td id="cell">Some text </td></tr></table>

If you have the following CSS, the text will be red:

td#cell { color: green }
td#cell { color: red }

But if you have the following CSS, the text will be green:

tr td#cell { color: green }
td#cell {color: red }

And if you have the following CSS, the text will be blue:

tr td#cell { color: blue }
tr #cell { color: green }
td#cell { color: red }

http://www.w3.org/TR/REC-CSS2/cascade.html#specificity

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/


Berislav Lopac

2004-06-17, 12:15 pm

Laurence Tureaud wrote:
> On Thu, 17 Jun 2004 02:14:22 GMT, Owen Jacobson
> <angstrom@lionsanctuary.net> wrote:
>
> aha.. but an ID should be used only once on any given page, right?
> because a book i'm reading "dreamweaver 2004 mx missing manual" says
> an ID is for formatting a unique item on a page.


Actually, it is for *locating* a unique item on a page. ID is not a CSS
property, but a HTML one, and it can easily be (and often is) used by other
languages that need to access the element, usually on client side (CSS and
Javascript) but possibly even on server-side.

Berislav

--
If the Internet is a Marx Brothers movie, and Web, e-mail, and IRC are
Groucho, Chico, and Harpo, then Usenet is Zeppo.


Sponsored Links


Copyright 2003 - 2008 forum4designers.com  Software forum  Computer Hardware reviews