「寬度」和「高度」默認設置的差異

Question

對於我的瀏覽器中的默認設置，width獲取默認值100%和height獲取默認值auto。

衆所周知，垂直和水平方向的默認效果是非常不同的。默認情況下，框的寬度（例如<div>，但是使用的元素當然會改變結果）將是周圍容器塊元素的100％。高度將顯然與文本高度相等。

但如果我設置width: auto;，它意味着：width和height現在具有相同的值auto，那麼效果還是非常不同的（事實上沒有爲寬度沒有區別）。

（我使用谷歌瀏覽器的最新版本的Windows 7，但沒有任何大的區別 - 瀏覽器是不是這裏不同）

我的問題在這裏，爲什麼有這樣在這兩個非常相似的proporties width和height？這樣一個很大的差異，價值auto給出了從這兩個非常不同的結果？

從另一個元素上獲得與默認效果相同的效果相當耗力。也就是說，這非常困難，需要額外的工作/解決方法才能獲得100％高度的效果以及適合文本寬度的寬度效果。我正在尋找的是理解這兩個比較好的價值。如果你們有一些很好的消息來源和鏈接，我會很高興。

Answer 1

你的問題是混亂的，但我會從我所瞭解

div答案是用默認的autoheight和默認的100%所以width一個塊級元素，如果你期望的高度=文本高度，比比則需要使用display: inline-block;或float

因此，在短期，height是auto默認和width寬度=句子/段落寬度是100%用於塊級元素。

對於一個內聯元素，height是汽車及width是汽車（height，width不會影響，除非你使用display: inline-block;）

Demo

Answer 2

很簡單，方式auto爲高度評價，傳統CSS中的寬度相差很大，這是Normal Flow工作方式的結果。

將寬度和高度從auto這樣的值轉換爲使用的值的方式在section 10 of the CSS 2.1 spec中詳細描述。