问题
w3schools says that for height:
auto : The browser calculates the height. This is default
But what does “browser calculates the height” mean? Does it mean it just simply sums up the contained elements’ heights? Is this always calculated with the same method for all browser?
回答1:
What does it mean browser calculates the height?
It means the browser will make the element's height sufficient to fit its content.
Does it mean it just simply sums up the contained elements heights if they are up on each other?
Nope, it is more complicated than that, but I'm sure that is part of it.
Is this always calculated with the same method for all browsers?
No, there are generally small variances. You should calculate the element's height in JavaScript if you intend to perform calculations based on it, don't assume it will have the same height on all browsers.
回答2:
The CSS 2.1 spec, and the CSS3 Basic Box model spec, have sections on how browsers should calculate heights:
- CSS 2.1, Section 10.6.3
- CSS3 Basic Box Model, Section 9
I find it a bit difficult to translate them into what should actually happen though, and I couldn’t say if browsers actually follow these descriptions.
回答3:
It summs up: the contained elements, plus the paddings, border and margins. The method for summing should be the same in all browsers, but the size of elements differ.
来源：https://stackoverflow.com/questions/7914327/what-exactly-does-the-auto-value-mean-for-the-css-height-property