James Lariviere wrote:
>
> I am not sure how this should render:
>
> body {
> padding: 50px;
> margin: 0;
> }
>
> In my html page (displays survey results in a table) I have a table
> that overflows my viewport.
>
> <table width="2000">
>
> right now mozilla renders the right end of the table snug against the
> right side of the viewport and does not add the 50px body padding.
> Is this right and if so why?
This happens with any block level element, not just tables.
In CSS2, 10.3.3 Block-level, non-replaced elements in normal flow, the
following equality is used to calculate the width of such an element:
"'margin-left' + 'border-left-width' + 'padding-left' + 'width' +
'padding-right' + 'border-right-width' +'margin-right' = width of
containing block"
What seems to be happening is that, since the BODY has a default of
'width:auto', its width will be constrained by width of its containing
block, which is the initial containing block, which will be the width of
the viewport.
So your table is simply overflowing the BODY element. Pop a border on
the BODY and you'll see this.
Generally, an 'auto' width will be constrained by its containing block,
whereas a containing block with 'auto' height will grow to accommodate
the content.
--
Regards,
Val Sharp - Edinburgh
