Динамическая верстка и flex
 

Друзья, столкнулся с следующей проблемой.

У меня есть флекс контейнер, куда я программно пытаюсь встроить несколько дивов.

вот код:

[JS]
function createMatrix(col, row){
let len = col * row;
for(let i = 0; i < len; i++){
let cell = document.createElement("div");
cell.classList.add('cell');
matrix.appendChild(cell);
cells.push(cell);
}
}
[JS]

У меня есть некоторый стилевой класс cell

#matrix .cell{
width:19px;
height:19px;
border-bottom:1px solid black;
border-right:1px solid black;
flex-wrap: wrap;
}

Так вот при динамическом добавлении этого класса неверно отрабатывает свойство flex-wrap: wrap;

При этом если я дивы добавляю вручную в верстке, то все хорошо.

если я переношу свойство на сам див (в стилях)

div{
flex-wrap: wrap;
}

То тоже все замечательно.

Проблема при динамическом добавлении класса, причем только свойства flex-wrap: wrap;

PsiMagistr,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

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

flex-wrap - это свойство flex контейнера.
Оно на #matrix должно ставиться.

Все правильно, так и есть.
 

Великое спасибо!
Вы правы.