CSS：具有惰性寬度的元素

假設我想製作一個具有固定高度和寬度的<p>元素，只有當高度不足以顯示所有文本時，該元素纔會增長。默認情況下，<p>是塊級元素。這意味着它有一個貪婪的寬度和懶惰的高度。我想要相反，懶惰的動態寬度和固定/貪婪的高度。內嵌塊元素嘗試在一行中顯示文本，如果可能的話，這不是我想要的。我只想要一個純粹的CSS解決方案。可能嗎？CSS：具有惰性寬度的元素

來源

2015-04-02 Cloud Strife

這是很難想象的，因爲文字不是垂直書寫的。所以'p'必須以至少最小寬度開始....（所以文本將被強制包裹在最小寬度內）。我想你可能會有更好的運氣告訴我們你想要達到的目標，而不是這個不可能的因素如何幫助你實現目標。 – Adam 2015-04-02 17:29:33

我可以看到像這樣的一個時髦的元素有些用途，但我，我自己，只是想做，因爲我可以。或者如果你想要另一種說明我的目標的方式，我正在測試這種語言的限制。 – 2015-04-02 17:54:15

恭喜。達到限制。我可以設想一堆黑客，都將有失敗的邊緣情況涉及變換.....聽@ Oriol的偉大答案（直接從規範），這是不能做到的。 – Adam 2015-04-02 17:56:17

這是不可能的。

9.4.2 Inline formatting contexts

在直列格式化內容，盒被佈局水平 [...]。包含形成線的框的矩形區域稱爲線框。

線框的寬度由containing block和確定浮線的存在。 [...]

一般而言，線框的左邊緣會觸及其包含塊的的左邊緣，右邊緣會觸及其包含塊的的右邊緣。但是，浮動框可能在包含塊邊緣的和線框邊緣之間。因此，儘管在相同內聯格式化上下文中的線框通常具有相同寬度（包含塊的寬度），但是如果可用的話，它們的寬度可以變化。由於floats，水平空間減小。 [...]

根據需要創建線框，以便在線內格式化上下文中保存內嵌級內容。 [...]

因此，線框的寬度將僅受包含塊的寬度和浮點數的影響。然後，根據需要將有儘可能多的線盒。

來源

2015-04-02 17:39:27 Oriol

CSS：具有惰性寬度的元素

回答

相關問題