Início / coding / Perguntas / 77713827
Accepted
Daksh Rawal
Asked: 2023-12-25 21:30:42 +0800 CST

CSS Flex (linha BootStrap)

  • 772

Como adiciono espaçamento entre as 4 divs na imagem abaixo

insira a descrição da imagem aqui

aqui como você pode ver 4 divs alinhados um ao lado do outro

o código para as divs únicas é:

<div class="col-lg-3 col-md-4 col-sm-6 mb-5 text-center">....</div>

e o pai dessas divs é:

<div class="d-flex row mx-auto" style={{ justifyContent: "space-around",alignContent:'center' }}>
....
</div>

A árvore completa é:

<div className="container mt-5 mb-5">
    <div class="d-flex row mx-auto" style={{ justifyContent: "space-around",alignContent:'center' }}>
        <div class="col-lg-3 col-md-4 col-sm-6 mb-5 text-center">
         ....
         ....
        </div>
    </div>
</div>
html

1 respostas

  1. Best Answer

    Você tentou adicionar margem a divs individuais?

    <div class="col-lg-3 col-md-4 col-sm-6 mb-5 text-center" style="margin: 10px">....</div>

    Depois que funcionar, você poderá estender posteriormente para uma classe personalizada.

    .spacing {
  margin: 10px;
}


<div class="col-lg-3 col-md-4 col-sm-6 mb-5 text-center spacing">....</div>
    • 1

relate perguntas