Entrar Ainda não tem acesso?
4
respostas

reset.css não está funcionando!

Referente ao curso HTML5 e CSS3 parte 2: posicionamento, listas e navegação

por Diogo Fukuyama Monteiro
| 30.4k xp | 3 posts

Olá! Por favor, preciso de uma ajuda para que o arquivo "reset.css" funcione. Eu coloquei o arquivo "reset.css" na mesma pasta de todo o restante do projeto, mas quando adiciono ele no arquivo "produtos.html", o navegador continua a deixar as bordas nas laterais e no topo da cor de fundo do cabeçalho. O programa está descrito da seguinte forma:

<!DOCTYPE html>
<htlm>
    <head>
        <meta charset ="UTF-8">
        <title>Produtos - Barbearia Alura</title>

        <link ref="stylesheet" href="reset.css">
        <link rel="stylesheet" href="produtos.css">
    </head>

    <body>
        <header>
            <h1><img src="logo.png"></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>

        </header>

    </body>
</htlm>

Grato!

4 respostas
por Daniela Michely da Silva
| 311.3k xp | 196 posts

Oi, Diogo.

Põe aqui também o print da tela com a aba lateral do editor de código aberta, e tembém já coloca o código do produtos.css

por Diogo Fukuyama Monteiro
| 30.4k xp | 3 posts

Oi Daniela! Segue o print da tela:

Insira aqui a descrição dessa imagem para ajudar na acessibilidadeE abaixo o código do .css:

header {
    background: #BBBBBB;
    padding: 20px 0;
}

.caixa {
    position: relative;
    width: 1400px;
    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: #000000;
    font-weight: bold;
    font-size: 22px;
    text-decoration: none;
}
por Daniela Michely da Silva
| 311.3k xp | 196 posts

Oi, Diogo.

Só cuida com forma como escreve as tags porque senão seu código não vai funcionar. Às vezes é coisa simples, mas acaba passando batido. Não se preocupe que isso acontece mesmo, só é tomar um pouco de cuidado.

Bom, não sei se vai funcionar, mas a princípio, troca o htlm lá em cima por html e testa.

por Diogo Fukuyama Monteiro
| 30.4k xp | 3 posts

Oi Daniela! Alterei o texto da tag de htlm para html como você informou, obrigado! Não tinha visto isso.

Mas de qualquer forma as bordas ainda continuam aparecendo no meu navegador, em cima e dos lados:

Insira aqui a descrição dessa imagem para ajudar na acessibilidadeMudei o código para colocar o texto na extremidade para ver se a borda ainda estava lá:

header {
    background: #BBBBBB;
    padding: 20px 0;
}



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

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

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