Как заставить flexbox включать отступы в расчеты?
Ниже два ряда.
Первый ряд это две вещи наflex 1
и один вflex 2
.
Второй ряд это две вещи наflex 1
.
Согласно спецификации1А + 1В = 2А
Но когданабивка в расчет включена неправильная сумма, как видно из приведенного ниже примера.
ВОПРОС
<, p> Как заставить flex box включать отступы в свои вычисления, чтобы блоки в примере выстраивались правильно?.Row{
display:flex;
}
.Item{
display:flex;
flex:1;
flex-direction:column;
padding:0 10px 10px 0;
}
.Item > div{
background:#7ae;
}
.Flx2{
flex:2;
}
<div class="Row">
<div class="Item">
<div>1A</div>
</div>
<div class="Item">
<div>1B</div>
</div>
<div class="Item Flx2">
<div>1C</div>
</div>
</div>
<div class="Row">
<div class="Item">
<div>2A</div>
</div>
<div class="Item">
<div>2B</div>
</div>
</div>