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

Largura da imagem não muda para 100% mesmo com o código igual à aula. Mais alguém com esse problema?

<!DOCTYPE html>
<html lang="pt-br">

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

</head>

<body>
    <img id="banner" src="banner.jpg">

    <h1> Sobre a Barbearia Alura</h1>

    <p>Localizada no coração da cidade a <strong>Barbearia Alura</strong> traz para o mercado o que há de melhor para o seu cabelo e barba. Fundada em 2019, a Barbearia Alura já é destaque na cidade e conquista novos clientes a cada dia.</p>

    <p id="missao"><em>Nossa missão é: <strong>"Proporcionar auto-estima e qualidade de vida aos clientes"</strong>.</em></p>    

    <p>Oferecemos profissionais experientes e antenados às mudanças no mundo da moda. O atendimento possui padrão de excelência e agilidade, garantindo qualidade e satisfação dos nossos clientes.</p>
</body>
</html>

referência CSS

body{
        background:#CCCCCC
    }

#banner{
    width: 100%;
}

h1{
    text-align:center
}


p{
        text-align:center;
    }

#missao{
    font-size:20px
}

em strong{
    color: #FF0000;

}
2 respostas
solução!

Opa, Luiz Fernando, tudo beleza?

Olhei seu código aqui. O que acontece é que os navegadores já possuem valores de margin e padding por padrão. Então o que aconselha-se é resetá-los para que você possa controlar inteiramente essas propriedades.

Você pode usar o arquivo reset.css (que o professor mostra acredito que na parte 2 do curso), ou você também pode colocar isso aqui no começo do código:

* {
margin: 0;
padding: 0;
}

O asterisco é o seletor universal e fazendo isso vai resetar o styling que o navegador está impondo no seu código. Mas dá uma olhada no arquivo reset.css que ele sim é completo com todas as tags.

Espero ter ajudado, um abraço!

Obrigado pela ajuda, Vinicius.

Com sua dica consegui resolver o problema. Certamente irei buscar sobre o arquivo reset.css que tu citou.

Valeu demais, abraço meu querido!