Forums

landysaccount

Hello.

I would like to understand why the following can't be applied to h2:

item-page h2:first-child a{
    text-decoration:none;
    text-align:left;
    line-height:27px;
    font-size:28px;
    margin-bottom:10px;
    font-weight:bolder;
    color:#000;
    background:red;

  }


                <div class="item-page">
    <h1><a href="#">
        Noticias    </a></h1>

    <h2>
            <a href="/virtualtesting/figureo56.com/figureo2.0/index.php?option=com_content&amp;view=article&amp;id=534:217-abogados-reclaman-cayo-levantado&amp;catid=24:noticias&amp;Itemid=151">Link</a>
        </h2>
    </div>

I can't understand why h2 is not getting the styles.

Thanks in advanced for your time and help.

TheDoc

Because the h2 is not the first child, the h1 is the first child element of .item-page. You're probably looking for h2:first-of-type but that is not supported by IE7 & IE8.

jkinney768

First, you need a period in front of your class (.item-page). Next, you need to move the :first-child behind the 'a'. So it will look like this instead:

.item-page h2 a:first-child

DesjardinsM

First item-page should be .item-page, but assuming that one was just a copy-paste typo. Well h1 is the first-child of item-page, rather than h2. If you'd want the h2 to get that style, maybe you would be looking for :first-of-type selector.

AndyHowells

There's a few ways you could get around this using descendant, sibling or adjacent selectors.

Is the format of .item-page always going to be the same pattern?

landysaccount

Yes, the missing dot was a copy/paste typo.

:first-of-type did the work.

I thought that :first-child meant the first h2 in .item-page ...

Thanks a lot for clarifying that.

AndyHowells

@landysaccount - :first-of-type is indeed handy but I'd recommend against using it for core styling at this point due to browser support. It might be better to use alternative (sneakier) selectors instead to get around that and ensure wide support.

treehouse : what would you like to learn today?

Forums

:first-child is not working for me...