1
resposta

Classe icones-redes-sociais

Se em bio.html e blog.html, a classe icones-redes-sociais foi definida em uma ul:

  • Por que, no site.css, usamos esta classe ligada a li? .icones-redes-sociais li { display: inline-block; } Não deveria ser ul? .icones-redes-sociais ul { display: inline-block; }
1 resposta

Fala Mario!

Tudo tranquilo?

Então, você se refere ao código abaixo correto?

HTML
            <ul class="icones-redes-sociais">
                <li>
                    <a href="https://github.com/joaodasilva">
                        <img src="github.png" alt="Github">
                    </a>
                </li>
                <li>
                    <a href="https://twitter.com/joaodasilva">
                        <img src="twitter.png" alt="Twitter">
                    </a>
                </li>
                <li>
                    <a href="https://br.linkedin.com/pub/joão-da-silva/32/4/508">
                        <img src="linkedin.png" alt="LinkedIn">
                    </a>
                </li>
            </ul>

CSS
.icones-redes-sociais li {
    display: inline-block;
}

Note que quem recebe a classe icones-redes-sociais já é a tag ul, sendo assim no CSS você busca o elemento que tenha essa classe, no caso é o próprio ul, o CSS está se referindo ao li pois ele está alterando a propriedade do li e não do ul.

O código abaixo tem o mesmo comportamento, e dá para ver a hierarquia mais corretamente, ele apenas não colocou o ul antes para uma questão de higienização de código e possível reaproveitamento do mesmo.

ul.icones-redes-sociais li {
    display: inline-block;
}

Todas as li que estão dentro da ul que tem a classe icones-redes-sociais

Espero ter ajudado!

Abraços!