Re: [css3-box] How do scrollbars affect width calculation?

On Sun, Jan 26, 2014 at 5:43 AM, Thomas Rosenau <rosenau@seitenbau.com> wrote:
> Citing from http://dev.w3.org/csswg/css-box/
>
> Section 19.1:
>> The space taken up by the scrollbars affects the computation of the dimensions in the rendering model.
>
> Does it? How so?
> The reason I'm asking is because I observe different behaviour in Firefox/Chrome:
>
> <div style="width:20px;padding:20px;overflow:scroll"></div>
> <script>
> console.log(getComputedStyle(document.querySelector('div')).width);
> </script>
>
> Firefox returns '20px', while Chrome returns '5px' (with scrollbars being 15px wide)
> Which one is correct?

Which Chrome?  I get '20px' on Chrome 33.0.1750.51

> Section 6.2:
>> If an element has scrollbars ..., then any space taken up by the scrollbars should be excluded from (subtracted from the dimensions of) any containing block formed by that element.
>
> At what point precisely should they be substracted?
> It should be made clear that vertical scrollbars affect the content edges of that element. That is, the content box is given a width of [width] - [scrollbar width], so the padding box including scrollbars is just as wide as the padding box of the same element without scrollbars.
> At least that's how all browsers currently implement scrollbars.

No, scrollbars are placed *in* the padding box if there's enough room,
so that the content box doesn't have to shrink unless the padding is
too small.

~TJ

Received on Sunday, 26 January 2014 16:57:10 UTC