SitePoint Sponsor

User Tag List

Results 1 to 5 of 5

Thread: Selector query

  1. #1
    SitePoint Zealot rushy2uk's Avatar
    Join Date
    May 2005
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Selector query

    How do I target an <a> element that contains a <span> with a class of "category-subs-parent".

    Here's the HTML:
    HTML Code:
    <a class="category-top" href="http://index.php?main_page=index&amp;cPath=9"><span class="category-subs-parent"><img src="bc_cat_pointer_down.gif" alt="" height="12" width="17">Fastback Binding</span></a>
    Here's my first guess at the CSS:
    Code:
    a > span.category-subs-parent {
    	background-color: #000000;
    }
    Can it be done?
    Imagination is the highest kite one can fly.

  2. #2
    Guru Meditation Error gnarly's Avatar
    Join Date
    Dec 2003
    Location
    Cheltenham, United Kingdom
    Posts
    692
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The following would all work:
    Code:
    a span {}
    Code:
    a span.category-subs-parent {}
    Code:
    a.category-top span {}
    Olly Hodgson
    thinkdrastic.net

  3. #3
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,159
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There's no way to target the A element with CSS2.1 (CSS3 will have a :&#58;parent pseudo-class).

    To target the SPAN element, use either of the following two:
    Code:
    a span.category-subs-parent {...}
    a>span.category-subs-parent {...}
    (The first one allows the SPAN to be a descendant of the A; the second one requires the SPAN to be an immediate child of the A.)
    Birnam wood is come to Dunsinane

  4. #4
    Guru Meditation Error gnarly's Avatar
    Join Date
    Dec 2003
    Location
    Cheltenham, United Kingdom
    Posts
    692
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oh, hang on, I see what you're asking now. Alas with CSS you can't work backwards up the tree. You can only ever target a child object - a child object cannot target it's parents.
    Olly Hodgson
    thinkdrastic.net

  5. #5
    SitePoint Zealot rushy2uk's Avatar
    Join Date
    May 2005
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AutisticCuckoo
    There's no way to target the A element with CSS2.1 (CSS3 will have a :arent pseudo-class).

    To target the SPAN element, use either of the following two:
    Code:
    a span.category-subs-parent {...}
    a>span.category-subs-parent {...}
    (The first one allows the SPAN to be a descendant of the A; the second one requires the SPAN to be an immediate child of the A.)
    Damn, I was afraid that was the case.
    You may be asking yourselves how I got in this mess?
    Well, I'm customising a Zen-Cart site at the mo, and I've installed a few contributions.

    Looks like I'll have to hack the code.

    Thanks for all the replies guys
    Imagination is the highest kite one can fly.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •