Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Problemas com o reset.css

Ao adicionar o reset.css no meu código, algumas coisas ficam desconfiguradas. euy adiciono o link para o reset.css antes do style.css, mas mesmo assim, algumas configurações se perdem, como o destaque de h1 e h2, mas outras configurações como a centralisação de texto, posição de imagens e outras coisas. Como eu posso concertar isso?

3 respostas

Boa tarde Ighor,

Caso não tenhe resolvido seu problema ainda. 1- Primeiro verifique se você possui os imports no cabeçalho do HTML como o modelo a baixo:

<head>
        <meta charset="UTF-8">
        <title>Barbearia Alura</title>
        <link rel="stylesheet" href="reset.css">
        <link rel="stylesheet" href="style.css">
    </head>

2- Verifique se os arquivos do css estão dentro da mesma pasta, caso não deixe tudo na mesma pasta, e tente novamente. 3- Lembresse da ordem de importação dos arquivos CSS, o resert.css, deve ser o primeiro, já que o CSS é carregado em forma de cascata, uma alteração feita no ultimo arquivo pode afetar algo feito em outro arquivo anterior.

Qualquer duvida pode me responder tentarei lhe ajudar.

solução!

Boa tarde, tudo certo?

Por favor corrijam-me se estou falando bobagem, mas eu estou entendo que a ideia do reset.css é resetar tudo as pré-definições que tem - como h1 e h2.

Se tu for verificar dentro do reset.css, o h1, h2, strong, em que colocamos dentro do nosso index.html estão "inutilizados esteticamente".

A ideia do reset.css é inutilizar estéticas e parâmetros do html dos navegadores, pois o H1 no chrome é diferente do H1 no firefox por exemplo e isso iria dar um problema de compatibilidade... Enquanto no chrome tá bem bonita a minha página, mas no firefox está horrível.

Acredito que é normal e a ideia do desafio é esse... Ajeitar tudo de novo o nosso index com o aprendizado que tivemos com a página de produtos.

Espero ter ajudado!!

Boa tarde Rodrigo,

Então sua ideia de funcionamento para que serve o reset esta correta, ele serva para limpar o maximo possivel dos estilos que que cada navegador implementa por padrão, (por isso no chrome fica de uma for e no firefox de outra, isso sem você implementar qualquer css).

Porem a proposta do CSS ele trabalha em cascata no caso o primeiro arquivo é carregado e assim por diante, se em algum outro arquivo a baixo você fixar uma lateração no mesmo elemento ele podera sobrescrever o que você fez, exe:

Considere que importamos primeiro nosso arquivo style.css e depois o reset.

arquivo style.css

p {
        color: red;
        font-size: 14px;
}
arquivo reset.css

p {
        color: black;
}

Com a referencia a cima assim que começar o carregamento do CSS, primeiro vem os estilos pradrão de cada navegar, depois será carregado nosso arquivo style.css, que atribuira cor vermelha, e fonte de 14px, quando o reset for carregado ele ira sobrescrever a cor do elemento p para cor preto. isso por que os arquivos que forem carredas depois podem influenciasr na estrutura de carregamento, j´pa que ele carrega de cima para baixo (Cascade = cascata).

Então para tirar todos os efeitos dos navegares sempre colocamos para importar o reset.css, e depois a ordem que queremos para carregar nossos arquivos, e um não interferir no outro, assim deixando sua pagina o mais identica possivel em varios navegadores. No comentário a cima descrevi a ordem de importação dos arquivos, qualquer coisa pode me perguntar, ou se não consegui lhe explicar direito.

Obs: Pelo seu comentario seria bom ver se todas as paginas possuem seus imports corretos com o do reset.css, e o arquivo criado para a mesma pagina.