1

Não estou conseguindo utilizar as seguintes divs com as propriedades:

.grid {
  display: block;
}

@media (min-width: 992px) {
  .grid {
    display: flex;
    flex-wrap: wrap;
  }
}

.column.left {
  flex: 4;
  background-color: red;
}

.column.right {
  flex: 8;
  background-color: blue;
}

Eu percebi que se eu remover isto:

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

funciona perfeitamente, mas se eu deixar não funciona, o problema é que eu preciso do box-sizing

<main class="main">
      <section class="section">
        <div class="container">
          <div class="grid">
            <div class="column left">a</div>
            <div class="column right">a</div>
          </div>
        </div>
      </section>
    </main>
4
  • Coloque o HTML na pergunta também que facilita.
    – Meu ovo
    15/06/2018 às 0:43
  • @dvd pronto adicionei
    – Banks
    15/06/2018 às 0:43
  • cara, que eu saiba o Bootstrap já tem por padrão o border-box nos elementos. Testei aqui e não vi nenhum comportamento diferente.
    – Meu ovo
    15/06/2018 às 0:50
  • mas nao estou usando bootstrap
    – Banks
    15/06/2018 às 0:53

1 Resposta 1

1

Olá, tive o mesmo problema com um template e resolvi inserindo uma classe conforme o exemplo:

<!DOCTYPE html>
<html>
<head>
    <title>Teste</title>
    <style>
    .display_flex {
        display: flex;
        flex-flow: row wrap;
    }
    </style>
</head>
<body>
    <div class=" row display_flex">
        <div class="col-md-4 col-xs-12 col-sm-6">
             <div class="box box-success">
                  <div class="box-header with-border">
                  </div>
             </div>            
        </div>      
    </div>
</body>
</html>

A recomendação é por essa classe na mesma <div> da row. Poderia ser configurado na própria row mas isso poderia afetar outras partes. Pode ser inserida essa classe no arquivo style "geral".

2
  • Mas ele não esta usando Bootstrap, nem classe com nome ROW tem no código dele...
    – hugocsl
    16/02/2019 às 11:00
  • @hugocsl Nesse caso ele iria inserir a classe display_flex na div da classe grid. 16/02/2019 às 12:19

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .