1
resposta

Estou tentando deixar as bordas da pagina de "Produtos" responsivo

Olá! Estou tentando deixar as bordas da pagina de "Produtos" responsivo, no entanto não estou tendo sucesso. Acredito eu que seja por ter deixado os itens do ".produtos li" com o "display: inline" e por isso a borda não consegue se localizar. poderia me ajudar ?

@media screen and (max-width: 480px){ .caixa, .produtos, header, footer{ width: auto; padding: 0px

}

h1{
    text-align: center;
}

nav{
    position: static;
}

.caixa{

}
.produtos li,.produtos{
    display: inline;
}

.produtos li{,
    width: 3em;
    border: 2px solid #000000; 
    border-radius: 10px;

}

.produtos img{
    margin: 0 0 0 4em;
}

}

Garanta sua matrícula hoje e ganhe + 2 meses grátis

Continue sua jornada tech com ainda mais tempo para aprender e evoluir

Quero aproveitar agora
1 resposta

Oi, Fernando, tudo bem?

Ao invés de somente display: inline utilize o inline:block; para que ele pegue a largura da página. Testa e me fala se der certo :}