2
respostas

Não estou conseguindo alinhar todos os blocos, Um bloco fica abaixo dos demais.

HTML

  • Cabelo

    Aquele corte essencial para o rolê, só na barbearia Alura.

    R$ 25,00

  •             <li>
                    <h2>Barba</h2>
                    <img src="barba.jpg">
                    <p>Quer garantir aquela barba estilosa, você está no lugar certo.</p>
                    <p>R$ 18,00</p>
    
                </li>
    
                <li>
                    <h2>Cabelo + Barba</h2>
                    <img src="cabelo+barba.jpg">
                    <p>O melhor corte em conjunto com o melhor design de barba.</p>
                    <p>R$ 35,00</p>
                </li>
            </ul>
    
            CSS
             .produtos {
     width: 940px;
     margin: 0 auto;

    }

    .produtos li { display: inline-block; text-align: center;

    }

2 respostas

Olá, João.

Tudo bem?

Para ter mais certeza era melhor mandar o código todo dos arquivos produtos.html e style.css, porém eu acho que é pela quantidade de texto quanto mais você escrever ele aumenta um pouco ou diminui o complimento, no card(bloco) que está menor, tenta escrever um pouco mais dentro da tag <p>:

Tipo:

<p>O melhor corte em conjunto com o melhor design de barba etc etc etc etc.</p>

oi João eu estava com esse mesmo problema agora pouco e oque eu fiz foi apagar a tag: ul e depois colocar ela novamente no mesmo lugar (abaixo do main e envolvendo todas as Li)