Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    Regular Coder
    Join Date
    Nov 2003
    Location
    Vancouver Island Canada
    Posts
    139
    Thanks
    0
    Thanked 0 Times in 0 Posts

    CSS ">" question

    I've searched but can't find the answer. What does the ">" mean in this CSS code?
    Code:
    body > html{color:red;}

  • #2
    New Coder
    Join Date
    Feb 2005
    Location
    Ontario Canada
    Posts
    44
    Thanks
    0
    Thanked 0 Times in 0 Posts
    it's a child selector

    E > F Matches any F element that is a child of an element E. Child selectors

    Selectors
    Channy

    I would love to change the world, but they won't give me the source code...

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    Canada
    Posts
    254
    Thanks
    0
    Thanked 0 Times in 0 Posts
    would that have the same effect as this then?

    html body {color:red;}

  • #4
    evo
    evo is offline
    waka Ionsurge
    Join Date
    Feb 2005
    Location
    United Kingdom
    Posts
    894
    Thanks
    5
    Thanked 12 Times in 12 Posts
    Well glenmac's version is the wrong way round, and pb&j, yup.

  • #5
    Senior Coder
    Join Date
    Feb 2003
    Location
    Ontario, Canada
    Posts
    1,223
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by pb&j
    would that have the same effect as this then?

    html body {color:red;}
    No. The child selector selects children only, whereas that selects ALL descendants.

    Edit: Though in this example the effect is the same, but only in certain browsers. IE, for example, will ignore html > body. IE will ignore the child selector, period.

  • #6
    Regular Coder
    Join Date
    Jun 2002
    Location
    Canada
    Posts
    254
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by AaronW
    No. The child selector selects children only, whereas that selects ALL descendants.
    ok, so i get understanding this correctly...

    tag1 > tag2 {style;}
    this ^ will apply the style to items in the tag2 area only. if there are other tag areas inside tag2, they will not be styled by this.

    tag1 tag2 {style;}
    this ^ will apply the style to items in the tag2 area fully. if there are other tag areas inside tag2, they will be styled by this as well.

    is that right?

  • #7
    Senior Coder
    Join Date
    Feb 2003
    Location
    Ontario, Canada
    Posts
    1,223
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yes. It just prevents cascading to grandchildren. Very useful, but unsupported by IE so virtually useless for any practical Web sites. Thankfully, my homepage doesn't aim to be practical so I'll be using that selector to generate my multi-level menu with CSS

    http://v3.offtone.com/ - An example of how it can be used (that page may be fubared when you look at it as I could be working on it)

  • #8
    Regular Coder
    Join Date
    Nov 2003
    Location
    Vancouver Island Canada
    Posts
    139
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you for your explanation.


  •  

    Posting Permissions

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