W3C home > Mailing lists > Public > www-style@w3.org > September 2012

Re: [css3-exclusions] how to handle exclusion shape-inside overflow

From: Alan Stearns <stearns@adobe.com>
Date: Wed, 26 Sep 2012 13:38:31 -0700
To: Bear Travis <betravis@adobe.com>, Hans Muller <hmuller@adobe.com>, "www-style@w3.org" <www-style@w3.org>
Message-ID: <CC88B45F.16BBC%stearns@adobe.com>
Bear,

I agree with your choices. Your answer to the second question follows what
Vincent added to issue 16460 (Specify overflow behavior for shape-inside)
[1]. And fitting the last line to the shape contours makes sense. I'll add
a paragraph in section 4.4.2 with a description of overflow with
shape-inside and add two example diagrams. The first diagram will be
similar to your option 3 with a rounded rect shape, and the second will be
similar to Hans's circle showing that the last line has no width, but with
a slight change that the remaining overflow fits just below the trailing
edge of the circle.

Thanks,

Alan

[1] https://www.w3.org/Bugs/Public/show_bug.cgi?id=16460

On 9/26/12 12:57 PM, "Bear Travis" <betravis@adobe.com> wrote:

>I think that there are two questions here.
>
>
>1. What is the correct behavior when the last line in a shape-inside
>content area is only partially contained by that shape?
>2. Where does inline content begin to lay out after it has overflowed the
>shape-inside?
>
>
>For the first question, I think that there are three options that make
>sense (see diagram [1]):
>Option 1. Inline content is not allowed to overlap the bottom edge of a
>shape-inside. The line box that would overlap the bottom edge is instead
>pushed down to the next available overflow position (determined by the
>answer to question 2).
>Option 2. Inline content can overlap the bottom edge of a shape-inside.
>The line box that overlaps the shape's bottom edge has a maximum width
>determined by the shape width at that line's top edge.
>Option 3. Inline content can overlap the bottom edge of a shape-inside.
>The line box that overlaps the shape's bottom edge has a maximum width
>determined by the minimum shape width between the line's top edge and the
>shape's bottom edge.
>
>
>I think option 3 makes the most sense, and it's what is proposed in Hans'
>diagrams. Previous lines in the shape-inside have not overflowed the
>shape-inside in the inline direction, and I think we should try to keep
>that behavior. At the same time, inline
> content defaults to stacking vertically with no separation [2], and so I
>think even if a line box overlaps the shape's bottom edge, it should
>still be placed right below the previous line box.
>
>
>On to the second question. I think that there are two major options (see
>diagram [3]):
>Option 1. The first line box outside the shape-inside is placed
>immediately after the previous line box. This aligns with the default
>behavior for inline formatting contexts.
>Option 2. The first line box outside the shape-inside is placed
>immediately after the logical bottom of its containing element.
>
>
>Here, I think option 1 makes the most sense, although it is slightly
>different from the behavior in Hans' diagram. Option 1 is similar to the
>behavior of overflow within a box that contains padding. Inline content
>begins laying out at the top padding edge,
> but continues to stack vertically with no space even if it goes past the
>bottom padding edge [4].
>
>
>-Bear
>
>
>[1] https://dl.dropbox.com/u/1558588/shape-inside-last-linebox.png
>[2] http://www.w3.org/TR/CSS2/visuren.html#inline-formatting
>[3] https://dl.dropbox.com/u/1558588/shape-inside-overflow-line-box.png
>[4] http://jsfiddle.net/hAMN6/1/
>
>
>
>From: Hans Muller <hmuller@adobe.com>
>Date: Tuesday, September 25, 2012 5:20 PM
>To: "www-style@w3.org" <www-style@w3.org>
>Subject: [css3-exclusions] how to handle exclusion shape-inside overflow
>Resent-From: <www-style@w3.org>
>Resent-Date: Wednesday, September 26, 2012 4:17 AM
>
>
>
>Here's a CSS Exclusions issue we'd like to see clarified in the spec.
>
>
>https://sites.google.com/site/hansmuller/webkit-blog/shape-inside-overflow
>.png
>
>
>The diagram above shows two examples of how inline content would overflow
>in the block direction, given a "shape-inside" exclusion shape. The shape
>on the left is a rounded rectangle and five line segments, represented by
>blue rectangles, fit entirely
> within it. If the rule for block direction layout within a shape is that
>the width of the last line segment is not constrained by horizontal shape
>edges, then the width of the last (sixth) line segment is constrained by
>the X axis radius of the rectangle's
> rounded corners. Only four line segments fit within the ellipse on the
>right because, per the rule, the bottom of the ellipse would constrain
>the width of a fifth line segment to zero.
>
>
>Assuming overflow is not hidden, content that overflows the shape begins
>below the shape's element or below the last overlapping line segment,
>whichever is logically lower.  The width of the overflow content is
>defined by the shape element's parent.
>
>
>Does this sound (and look) correct?
>
>
>This issue was also raised here,
>https://www.w3.org/Bugs/Public/show_bug.cgi?id=16460
><https://www.w3.org/Bugs/Public/show_bug.cgi?id=16460>.  In this case,
>overflow content was to begin immediately below the shape and the
>overflow's width would be defined by the shape-inside element.
>
>
>
>
>
>
>
>Thanks,
>- Hans 
>
>
>
>
>
>
Received on Wednesday, 26 September 2012 20:38:59 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:21:00 GMT