將flex內嵌的Html元素對齊

我正在開發一個動態應用程序。我有一個flex-direction屬性的div標籤。是否有可能在文本中添加一個span標籤並且文本平行排列？將flex內嵌的Html元素對齊

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

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

但文本帶有換行符顯示。一個重要的事情是我沒有編輯班級'.parent'。

2017-08-16 Vimal

我可以看到你想要的藍圖？ – zynkn

具有'列'方向的柔性容器將垂直堆疊子元素（包括匿名元素，如展開的文本）。如果你不能編輯容器樣式，那麼水平對齊的唯一flex選項就是將子元素用'row'方向包裝在一個嵌套的flex容器中。 –

你可以試試這個：

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

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

2017-08-16 06:49:26 kravisingh

這個問題指出，'.parent'類不能被修改。 –

回答