html - 将 Html 元素与 flex 属性对齐

Question

我正在开发一个动态应用程序。我有一个带有 flex-direction: column 属性的 div 标签。是否可以在该 div 内添加一个 span 标签，文本平行对齐？

.parent {
   display: flex;
   flex-direction: column;
}

<div class="parent">
    Item 1
    <span style="border: 1px solid;">item 2</span>
</div>

但是显示的文本带有换行符。一件重要的事情是我没有编辑“.parent”类。

Answer 1

你可以试试这个:

body{
  display: flex;
}
.parent {
   flex: 1 1;
   flex-direction: column;
}

<div class="parent">
    Item 1
    <span style="border: 1px solid;">item 2</span>
</div>