How *should* this content be rendered when h-scrolling is introduced?
Giv开发者_StackOverflow社区en markup like this:
<body>
<div style='text-align:center'>header</div>
<table>
<tr><td>
really_wide_table................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................
</td></tr>
</table>
</body>
How should it be rendered if the table is so wide that horizontal scrollbars are introduced?
Should the header div be centered in the left-most visible screen, or centered above the table? Or something else?
Note: I know what does happen, what I'm looking for is an official reference that defines what should happen (I ran into an issue).
A div
is a block element and by definition has its default width
set to 100%
of it's parent container. The parent container in this case is the visible part of the browser window.
So no matter how wide (or how narrow; try it) the table below (or any element for that matter), the div
will still fill 100% of the visible browser window.
Since the div
is as wide as the window, it will appear centered in the window.
I don't have any "official" reference to this but I do know this is how the DOM and CSS specifications work.
精彩评论