Estilização de itens da lista

Lição 11 de 12 do curso Barra de Navegação Inferior - Projeto HTML/CSS da Coddy.

Vamos adicionar estilização para itens de lista; usando isso, você poderá ajustar os ícones adequadamente.

Desafio

Fácil

Selecione os itens da lista da classe navigation e da lista não ordenada .navigation ul li:

Defina a altura (height), largura (width) para 35px e a margem (margin) para 1rem.
Defina o preenchimento (padding) para 0 1rem.
Defina a cor (color) para o que você desejar! (recomendado: white)
Defina o raio da borda (border-radius) para 50%.
Defina o display para flex, align-items e justify-content para center.

Adicione a estilização abaixo:

cursor: pointer;
transition: all 0.2s linear;

Experimente você mesmo

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Write HTML code here -->
        <script src="script.js"></script>
    </body>
</html>