Join GitHub today
GitHub is home to over 28 million developers working together to host and review code, manage projects, and build software together.Sign up
How does wrap-flow apply when a shape has holes? #37
Source: http://tavmjong.free.fr/SVG/TEXT_SYDNEY_2016/#Wrapped (See 3.3)
The ''wrap-flow' property allows choosing how wrapping flows around an exclusion. It's not clear how this would apply to divided lines from the 'shape-inside'.
A single element might need both external and internal wrapping controls. For example, a pull quote in a magazine layout: you want the quote to wrap to a shape, but you also want the column text to wrap around it. See an example here of dual wrapping. Now imagine the leaf shape was a maple leaf or something else with deep lobes that interrupt the text. Do you want to continue the text on the other side of the interruption or not?
I think it is important to have author control over this, so we would need a new property. It would also be needed for CSS Shapes 2 / CSS Exclusions (which would define how to create layouts like the linked example).
The values for the new property (
I would suggest that either
I can put together a demo of the options, if @Tavmjong does not already have something similar.
Note that I do not think that this property would be a reasonable way of dealing with flowing text from one shape to another, as describe in Issue #38. That is about filling one shape neatly, then moving to the next, like flowing from one column to another.
From the CSS/SVG working group joint face to face in Sydney on 3 February 2016, the following were confirmed:
Examples of the same shape with different wrapping scenarios. Text is manually positioned, so padding is not super precise and hyphenation may be non-standard, but you get the gist:
The example brings up a problem with