Создание динамических блоков: при скрытии одного — второй заполняет всю ширину?

Question

[maxdubovik]

Доброго времени всем.
Есть такая задумка - хочу реализовать сетку на bootstrap динамическую.
Пример:

<div class="col-sm-12">
        <div class="col-sm-6">Первый</div>
        <div class="col-sm-6">Второй</div>
</div>

Суть вся в том, что хочу , что бы при событии close блок пропадал, а его область занимал соседний(то есть был до скрытия col-sm-6, а стал col-sm-12 ).
Буду признателен за костыли или готовые примеры.
Всем добра и чистого кода)

Comments

[Сергей delphinpro]

https://jsfiddle.net/DelphinPRO/4b8yrmuw/

[Сергей delphinpro]

Это из разряда "костылей" )

Answer 1

[iBird Rose]

для этого есть flex. либо сам пиши, либо бери 4 версию бутстрапа https://getbootstrap.com/docs/4.0/layout/grid/

Comments

[maxdubovik]

Спасибо, друже)

Answer 2

[Сергей Иванов]

Flex, но есть ещё дедовский способ - табличная вёрстка, и это не костыль.
При добавлении

.cell.first {
  display: none;
}

получаем ожидаемое.