Использование Bootstrap и Flexbox в одном проекте

Question

Я работаю над интерфейсным проектом на основе React. Я просто задавался вопросом, есть ли возможность объединить использование Bootstrap 3 и Flexbox в одном проекте, так как я хотел бы использовать как удобство использования компонентов Bootstrap (с использованием пакета response-bootstrap), так и возможности компоновки Flexbox, которая разрушается когда они используются вместе с бутстрапом, как я пытался раньше. Есть ли способ заставить их работать вместе?

Answer 1

Некоторые из гибких рамок CSS имеет общие имена классов, как row, col-*, который конфликтует с именами классов начальной загрузки.

Вы можете попробовать это, http://bulma.io/

Конечно, он предлагает больше, чем сетки, но вы можете просто дать его попробовать.

Спасибо!

Answer 2

Apparantly молитва уже ответили ... flexbox in Bootstrap

Answer 3

.flex-row { 
    display: flex; 
    flex-wrap: wrap; 
} 
.flex-row > [class*='col-'] { 
    display: flex; 
    flex-direction: column; 
} 
.flex-row.row:after, 
.flex-row.row:before { 
    display: flex; 
} 

Это работает с React-Bootstrap:

<Row className="show-grid row-no-padding flex-row">