Css target :first-child... before any text node? (2.1)

Discussion in 'HTML' started by ReGenesis0, Feb 10, 2009.

  1. ReGenesis0

    ReGenesis0 Guest

    So I've got this thing...

    I want to apply css styles to a link if it's the first piece of
    content within a LI, but /not/ if it's got anything before it.

    <li> <a>Styled!</a> <li>
    <li> This is <a>not styled!</a> <li>
    I'm targeting the element I want to style with:
    li > a:first-child { background-color:pink; }

    And that works... insofar that if there are 2 <a>'s, only the first ti
    styled, and if there are any child elements before the <a> (like a
    <span>) then <a> is not styled.

    But-- it doesn't do what i want if there is TEXT before the :first-
    child node...
    <li> This is <a>not styled!</a> <li>

    The <a> is still styled, even though I want it not to be.

    Approaching this from a DOM perspective, I would think that text-nodes
    would count as children, and disqualify <a> from being a first-
    child. ...but this is not the case.

    Is there anything I can combine this with to get the effect I
    want? :first-letter doesn't seem to fit the bill... but maybe I'm
    just not thinking sideways enough?

    Am I just out of luck?

    -Derik
     
    ReGenesis0, Feb 10, 2009
    #1
    1. Advertising

  2. ReGenesis0 wrote:

    > I want to apply css styles to a link if it's the first piece of
    > content within a LI, but /not/ if it's got anything before it.


    You can't, except by using class (or id) attributes for those links.

    > li > a:first-child { background-color:pink; }
    >
    > And that works... insofar that if there are 2 <a>'s, only the first ti
    > styled, and if there are any child elements before the <a> (like a
    > <span>) then <a> is not styled.


    And if IE 6 is not used.

    > But-- it doesn't do what i want if there is TEXT before the :first-
    > child node...
    > <li> This is <a>not styled!</a> <li>
    >
    > The <a> is still styled, even though I want it not to be.


    It works the way you wrote in CSS, not the way you wanted.

    > Approaching this from a DOM perspective, I would think that text-nodes
    > would count as children, and disqualify <a> from being a first-
    > child. ...but this is not the case.


    It's not the case. Textual content inside an element does not constitute an
    element.

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
     
    Jukka K. Korpela, Feb 10, 2009
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Bryan Ax
    Replies:
    6
    Views:
    547
    Peter Flynn
    May 17, 2006
  2. Tjerk Wolterink
    Replies:
    2
    Views:
    1,437
    Dimitre Novatchev
    Aug 24, 2006
  3. Replies:
    1
    Views:
    1,206
    Joe Kesselman
    Nov 1, 2006
  4. mohit
    Replies:
    0
    Views:
    563
    mohit
    Jan 23, 2008
  5. Replies:
    2
    Views:
    827
    Martin Honnen
    Mar 17, 2008
Loading...

Share This Page