Flex — внутренний перенос строки, почему не срабатывает?

Question

[Антон Вебсайтовский]

Всем привет.

Есть блок, в блоке идет центрование контента по вертикали, пытаюсь сделать контент в две строки, а он мне в одну делает, я походу что-то о флексе не знаю )))

Применял - flex-wrap wrap - но чет не срабатывает.

https://jsfiddle.net/taonvqh0/

Comments

[HamSter]

<div class="df fv wr">
<b>Audio</b>
<b>Audio1</b>
</div>

b {
  display: block;
  width: 100%;
}

[Антон Вебсайтовский]

HamSter, понял, методом костыля )

[Антон Вебсайтовский]

а как быть если просто текст будет не в теге.

типа:

аппвапвап<br/>
gfgdfgdfgdfg

[HamSter]

Антон Вебсайтовский, почему костыля? В стилях указали класс wr (wrap), но в разметку не добавили. А чтобы блоки переносились, нужно чтобы они занимали всю ширину (поэтому 100% для b), либо тогда не применять флекс.

[Softlink]

А почему нельзя просто указать flex-direction: column?

[Антон Вебсайтовский]

HamSter, ну, а если мне не везде для b, надо делать перенос, тут тогда надо класс в тег пихать который будет делать 100%, если нужен будет перенос.
а если не текст не в теге, то как мне перенести )), надо будет оборачивать в тег тогда что-то, как флекс не идеален.

[Антон Вебсайтовский]

Softlink, а это как? приведите пример.

[Softlink]

Антон Вебсайтовский, ну ссылка же в комментарии

[Антон Вебсайтовский]

Softlink, а во вижу ) епт.

[Антон Вебсайтовский]

Softlink, данное свойство flex-direction column я так понял, делит на строки, если обернуто в теги.