好的，我遇到了以下問題：我有一個包含文本的<div>。該文本有一些非常長的行，例如 "要使用這個頁面，您必須先注冊一個帳戶...... "等等
在這個div的右側，我有一個圖片。當用戶在小螢屏上時，我希望將內容包裹起來。當他不在時，影像應保持相同的大小，而 div 上的文本應包行（但保持兩個元素并排）。
到目前為止，我只有在添加flex: 0 1 400px的組合時才能使文本被包裹，例如。但是這個組合在調整螢屏大小的時候會讓事情變得很奇怪，因為即使螢屏上有空間，文本也會保持包裹狀態（因為 div 不會增長）。
因此，我可能正在尋找的是，如果有一種方法可以說 "只有在父級尺寸低于 "時才包裹內容。這可能嗎？
uj5u.com熱心網友回復：
你可以嘗試將flex屬性設定為一個媒體查詢，只針對超過父級尺寸的螢屏，所以它將類似于：
@media only screen and (min-width: *size* px){
parent{
flex: 0 1 400px;
}
}
通過使用這個，文本不應該再在低于size變數的螢屏上纏繞
。uj5u.com熱心網友回復：
好吧，我能夠用@media使它作業。最后，我確實添加了一個@mediawithmin-width: 并設定了flex-direction: row`，這樣它就可以模擬包起來了。
我試著玩了一下flex-wrap，但是當我包起來的時候，父元素不會調整大小，所以我不能讓其他元素居中，所以這就是我最后的解決方案了。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/306766.html
標籤：
上一篇：使用 1按鈕的奇怪行為