Entrar Ainda não tem acesso?
Solucionado (ver solução)

Importante

Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!

Solucionado
(ver solução)
10
respostas

reset.css não retira as margens branca do header

Referente ao curso HTML5 e CSS3 parte 2: posicionamento, listas e navegação, no capítulo Navegação entre páginas e atividade Arrumando a lista

por leandroalves00
| 63.1k xp | 8 posts
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Produtos - Barbearia Alura</title>
        <link rel="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>
</html>

insira seu código aqui

10 respostas
por Francisco Tiago Cipriano de Castro
| 218.9k xp | 150 posts

Oi Leandro como está o código da reset.css?

por leandroalves00
| 63.1k xp | 8 posts

Olá Francisco,

baixei ele direto do exercício, não precisei editar nenhuma linha.

/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; }

por Francisco Tiago Cipriano de Castro
| 218.9k xp | 150 posts

Vi aqui! Fiz um teste e deu certo. Os arquivos css estão na pasta raiz também ou em algum subdiretório?

por leandroalves00
| 63.1k xp | 8 posts

Tudo no mesmo diretório. Fiz um teste no Edge e deu certo. Mas, no chrome não. Vc tá usando qual?

solução!
por Francisco Tiago Cipriano de Castro
| 218.9k xp | 150 posts

Qualquer um aqui dá certo! Abri no Mozilla Firefox primeiro!

Tenta limpar o cache!

Segura o CTRL + F5 pra atualizar!

por leandroalves00
| 63.1k xp | 8 posts

Reinstalei o Chrome e deu certo tb. Fiquei sem entender. Mas agora não tá dando espaço do menu para a anto direito da tela.

por Francisco Tiago Cipriano de Castro
| 218.9k xp | 150 posts

Show! Deixa eu ver teu produtos.css

por leandroalves00
| 63.1k xp | 8 posts

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

.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: #000000; font-weight: bold; font-size: 22px; text-decoration: none; }

por leandroalves00
| 63.1k xp | 8 posts

Fala Francisco.

Então, o problema estava no html mesmo. A

não estava englobando a linha do h1. Por isso dava errado. Obrigado pela ajuda.

por Francisco Tiago Cipriano de Castro
| 218.9k xp | 150 posts

Vi aqui! Tá faltando incluir uma DIV em HEADER com a CLASS caixa:

<header>
        <div class="caixa">
            <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>
        </div>
        </header>

Tópicos relacionados

Mostrar mais tópicos Mostrar menos tópicos

Conteúdos Alura com o tema

Trilhas por carreira

Carreiras de IA

Carreiras de Dados

Carreiras de Cyber

Carreiras de DevOps & Cloud

Carreiras de UX & UI

Carreiras de Mobile & Front-End

Carreiras de Back-End

Carreiras de Negócios

Cursos universitários FIAP

Graduação | Pós-graduação | MBA