表格的 Flex 方向

Question

Here is what I'm intending to do: Table

Current HTML + CSS, for some reason the table can't contain multiple objects in a row.:

 .boardTitle{ margin-top: 10px; text-align: center; font-size: 20px; color: red; } .boardTable{ flex: 1; flex-direction: column; } .boardRow{ flex-direction: row; } .thread{ border: solid; }

 <div> <div class="boardTitle"> Name </div> <div class="boardTable"> <div class="boardRow"> <div class="thread"> 1 </div> <div class="thread"> 2 </div> </div> </div> </div>

Answer 1

.boardRow class is contain the threads so you should give it display: flex if you want them to be next each other.

.boardRow{
      display:flex;
      flex-direction: row;
    }