Entrar Ainda não tem acesso?
1
resposta

Duvida sobre tamanho com porcentagem

por Mateus
| 21.5k xp | 53 posts
.produtos li {
    display: inline-block;
    text-align: center;
    width: 30%;
    vertical-align: top;
    margin: 0 1.5%;
    padding: 30px 20px;
    box-sizing: border-box;
    border:#000000 2px solid;
    border-radius: 10px;
}

na aula assim que o professor coloca a margin: 0 1.5% todos os itens ficam perfeitamente alinhados. Mas eu não consegui entender muito bem o porque isso acontece. Alguém sabe me dar uma boa definição?
1 resposta
por Andrei da Silva Pereira
| 51.1k xp | 7 posts
Programador

Olá,

Isso acontece nesse curso pelo seguinte :

O card dele possui um tamanho de 30% (width: 30%;) mais a margem do lado de 1.5% para cada lado ( margin: 0 1.5%;).

Ou seja esse card vai ocupar 33% (30 + 1.5 + 1.5), e como são 3 card (33+33+33) acaba dando os 99% da tela. por isso fica alinhado.

Espero ter conseguido explicar de uma forma que dê para entender kkk.