1
resposta

Problema ao utilizar o nav na pagina principal

Estou com duvida pra replicar o nav da pagina de produtos para a pagina principal. Na pagina principal, mesmo usando a mesma configuração CSS, os itens da minha lista estão um abaixo do outro. O que fazer?

<header>
        <div class="caixa">
            <h1><img src="imagens/logo.png" alt="img-logo"></h1>

            <nav>

                <ul>
                    <li><a href="index.html">Home</a></li>
                    <li><a href="produtos.html">Produtos</a></li>
                    <li><a href="contato.html">Contato</a></li>
                </ul>

            </nav>
        </div>

    </header>

insira seu código aqui

header {
    background: #bbbbbb;
    padding: 20px 0;

}

.caixa {
    position: relative;
    width: 940px;
    margin: 0 auto;
}

nav {
    position: absolute;
    top: 110px;
    right: 0;
}

nav li{
    display: inline;
    margin: 0 0 0 15px;
}

nav a {
    text-transform: uppercase;
    color: black;
    font-weight: bold;
    font-size: 22px;
    text-decoration: none;
}

nav a:hover {
    color: #3de9e9b6;
    text-decoration: underline;
}
1 resposta

Fala ai José, tudo bem? Aplique um display: flex na sua nav ul.

Espero ter ajudado.