2
respostas

[Dúvida] Página Produtos e Contato - Não responsiva

Opa Galera, gostaria de verificar se alguém consegue me ajudar... minha página home da Barbearia ficou responsiva, mas a produtos e contato não, tentei ajustar mas não sei no que posso ter errado... segue código CSS abaixo:

/* CSS RESPONSIVO */

@media screen and (max-width: 480px) {

    .caixa, .principal, .conteudo-beneficios, .mapaconteudo, .video, .contato 
    {
            width: auto;
    }

    h1 {
            text-align: center;
    }

    nav {
            position: static;
    }

    .lista-beneficios, .imagem-beneficios {
            width: 100%;
    }

    .produtos {
            width: auto;
    }


    .produtos li {
            width: 80%;
            margin: 5px 25px;
    }

    .contato {
            margin: 15px auto 5px 15px;
    }


    .principal, .titulo-principal, .conteudo-beneficios {
            margin: 5px 15px 15px 15px;
    }


    .produtos li img {
            width: 100%;

    }

    form, fieldset, table {
            margin: 40px 10px 10px;
    }

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

} Insira aqui a descrição dessa imagem para ajudar na acessibilidade Insira aqui a descrição dessa imagem para ajudar na acessibilidade

2 respostas

Opa... acima de ".caixa" está correto, só não saiu no código:

@media screen and (max-width: 480px) {

Oi João, tudo bem?

Desculpe a demora em retornar.

Verifica se nas tags meta você linkou a tag meta viewport:

<meta name="viewport" content="width=device-width">

Ela é responsável por deixar que suas modificações nas medias queries sejam aplicadas.

Um abraço e bons estudos.