Blog Web Standards

Soluções para os problemas enfrentados pelos desenvolvedores HTML e CSS no dia-a-dia

É comum utilizarmos o seletor :nth-child() para selecionar o itens dentro de uma regra específica (segundo, terceiro e assim por diante), em conjunto com :first-child e :last-child.

Porém o CSS também possui um seletor que permite estilizar itens a partir do último filho de determinado elemento, ou seja, na ordem inversa. Para tanto, é só utilizar :nth-last-child(), colocando o índice desejado dentro dos parênteses. Por exemplo, selecionando o penúltimo parágrafo dentro de uma div:

div p:nth-last-child(2) { color: #fff; }

E como fica o suporte aos navegadores? Não se preocupe, a partir do IE9 você não terá problemas, dê uma olhada no Can I use.

Mais informações sobre :nth-last-child()

1 comentário

Responder
  1. 5 de maio de 2017

    Leandro disse:

    Obrigado pela dica galera! 🙂

Escreva seu comentário