Seletor :last-child

[Maykel-ctba 233]

Fala galera,

 

estou com uma dúvida. Estou tentando usar o seletor :last-child mas por algum motivo, não está selecionando o elemento que eu gostaria.

 

HTML

<div class="col-sm-4">
    <h1>Notícias & <br>Artigos</h1>
    <article>
        <h2>Diagnóstico empresarial</h2>
        <p>Não é todo dia que estamos no nosso melhor momento. Há dias em que estamos com dor de cabeça, ou com...</p>
    </article>
    <article>
        <h2>Diagnóstico empresarial</h2>
        <p>Não é todo dia que estamos no nosso melhor momento. Há dias em que estamos com dor de cabeça, ou com...</p>
    </article>
    <a class="btn-home">Veja os artigos publicados</a>
</div>

CSS

#conteudo #linha-03 article { margin:0; padding:0; padding-bottom:35px; margin-bottom:35px; border-bottom:1px solid #CCC; }
#conteudo #linha-03 article:last-child { padding-bottom:0; margin-bottom:0; border-bottom:none; }

Ele só funciona se eu tirar o link da div (remover o <a class="btn-home">...).

Mas, na lógica, ele não deveria selecionar o ultimo ARTICLE da #linha-03?

[Marlon Pacheco 132]

Cara, o :last-child procura pelo último elemento especificado, dentro do elemento pai.

O seletor só vai funcionar se o último elemento da #linha-03 for um <article>.

No seu exemplo, o último elemento é um <a>.

Você pode utilizar o :last-of-type para identificar o último <article>.

[Maykel-ctba 233]

Hummm entendi, não é o último ARTICLE, e sim o ultimo elemento dentro do pai do Article, seria isso?

[Marlon Pacheco 132]

Quase isso aí. Ficou bem confusa essa especificação.

Seria o último article dentro do elemento pai, desde que o último elemento seja um article. Confuso pra &¨*%&@...

É praticamente um if. heheheh

[Maykel-ctba 233]

Entendi! heheheh

 

Legal, desse jeito funcionou mesmo!

Muito obrigado pela dica e pela explicação! :coolio: