html
is a proper block-level element, just like body
, p
, div
, etc — it therefore observes all the same overflow rules as other block elements do.
However, the reason why the background of html
bleeds past its border when content overflows its width (or when its width is less than 100% of the browser window, or viewport), is because the background color is propagated to the viewport, which is the canvas containing html
and all its contents that are rendered. The border remains part of the html
element, however, so the element doesn't expand when the content overflows. This behavior is very similar to how applying a background to body
, but not html
, causes the body background to propagate to the root element anyway, as described in this answer which cites this section of the spec.
As Alohci notes in a comment under the answer, the same applies to html
with respect to the viewport:
Note that html behaves with respect to the viewport in much the same way as body behaves with respect to html, with the background escaping beyond the confines of the html element. See http://jsfiddle.net/GmAL4/4/ to see what I mean.
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…