如何讓 Flexbox 子項的寬度由其內容決定？

Flexbox 子寬度

帶有顯示的父容器 div：flex 有一個子 a。如何讓子元素顯示為“內聯”，其寬度由其內容決定？

解決方案

在容器上使用align-items: flex-start 或align-self : 每個上的彈性啟動

分析

Flex 容器有一個預設的align-items設定：stretch，導致子元素沿著橫軸展開。透過設定align-items: flex-start或align-self: flex-start，可以防止子寬度擴展並實現內聯外觀。

附加資訊

• align-self 適用於單一彈性項目，而align-items 適用於整個容器。
• align-items: flex-start確保與容器開頭的橫軸對齊。

• 有關 Flex 對齊的更多信息，請參閱：

  • [flex-wrap 是如何工作的？ ](link1 )
  • [為什麼沒有「justify-items」和「justify-self」屬性？ ](link2)

以上是如何讓 Flexbox 子項的寬度由其內容決定？的詳細內容。更多資訊請關注PHP中文網其他相關文章！