- From: Gérard Talbot <www-style@gtalbot.org>
- Date: Wed, 29 Jan 2014 01:30:26 -0500
- To: Thomas Rosenau <rosenau@seitenbau.com>
- Cc: W3C www-style mailing list <www-style@w3.org>
Le 2014-01-28 04:36, Thomas Rosenau a écrit : > Hello Gérard, > > thanks for the clarification. > > I realized that I accidentally didn't reply to the mailing list. Hope > it is ok to share the message below. > > > >> CSS width is to be substracted from the width of scrollbar even though >> the scrollbar is located between padding box and border box. So, >> content >> area is shrunk of "xxx" (from 9 "x" to 6 "x" in your ascii example) > > Well, is it really the content area or just the containing block formed > by that element? > > When using { background-clip: content-box; } it can be seen that the > content area is apparently not affected. > (cf. http://jsfiddle.net/LNMZU/) Content area should be affected, should be reduced, narrowed down: from 9 "x" to 6 "x" in your ascii example. But CSS width should remain the same. > Now, I found that the fundamental error I made was the assumption that > a > box's text content would take the whole content width. But it does if there is no padding: the box's text content take the whole content width (with white space line breaking taken into consideration). > However, this is > not the case, as can be seen from > > http://www.w3.org/TR/CSS2/visuren.html#anonymous-block-level This was a diagram serving a specific purpose. We don't know the styling in effect applying on the div and on the p elements. And, most important, that diagram was created to display, to show the 3 boxes discussed in the section. The diagram is not a valid representation of what you refer to as content area. > So my current conjecture is that the following figure should be > correct: > > +-------------------------+-+ > | xxxxxx### |^| > | xxxxxx### |~| > | xxxxxx### | | > | xxxxxx### | | > | xxxxxx### | | > | xxxxxx### |_| > | xxxxxx### |v| > +-------------------------+-+ > > | padding | width | padding | > > | | > width-scrollbarWidth You extend padding-right under the vertical scrollbar. I think this is not correct. You also extend padding-right under the vertical scrollbar at http://jsfiddle.net/LNMZU/ and I think this is not correct. Scrollbar is part of CSS width even though scrollbar is located between padding and border: that is all you really need to keep in mind. > where xx=content and x#=content area. I am not sure I understand your diagrams anymore. Here's how I see all this (where "x" represent content area and not 9 letters words): +-------------------------+ | xxxxxxxxx | | xxxxxxxxx | | xxxxxxxxx | | xxxxxxxxx | | xxxxxxxxx | | xxxxxxxxx | | xxxxxxxxx | +-------------------------+ | padding | width |padding| and here the space taken up by the scrollbar is subtracted from the dimension (width is reduced from 9 "x" to 7 "x" in my ascii example) of the content box formed by the element with the scrollbar. +-----------------------+-+ | xxxxxxx |^| | xxxxxxx |~| | xxxxxxx | | | xxxxxxx | | | xxxxxxx | | | xxxxxxx |_| | xxxxxxx |v| +-------------------------+ | padding |width|padding| Both ascii examples have the same offsetWidth. Both ascii examples have the same respective horizontal padding-left and padding-right. > Again, this is because the text content forms an anonymous block ? No. > and > thus is constrained by the containing block. In other words: the > element's containing block does not coincide with the content area. > This feels a bit weird but it's the way the specs work. > > I think we agree that computedStyle.width should not be influenced by > scrollbars. Yes. computedStyle.width should return the same value (say, 20px) regardless of scrollbar presence or absence. I have an interactive example in mind for you. I'm very busy this week and I am still very sick with influenza right now. I'll try to get back to you on this later. Gérard
Received on Wednesday, 29 January 2014 06:30:58 UTC