HTML and CSS Reference
In-Depth Information
wrap-flow
specifies what side of the exclusion element, in this case the figure,
you want the text to flow around. You can specify
auto
,
start
,
end
,
both
,
maximum
,
or
clear
:
auto
is the default: If you set this value, the surrounding text will not wrap
around the exclusion; it will just sit underneath the exclusion element as
if it doesn't exist.
start
means that content will wrap around the start of the exclusion, but
the space after the end of it will be left empty of content.
end
means that content will wrap around the end of the exclusion, but the
space before the start of it will be left empty of content.
both
means that the content will wrap around the start and end of the
exclusion.
maximum
will cause content to wrap around the side of the exclusion that
has the largest amount of space next to it.
clear
means that content will only wrap around the top and bottom of the
exclusion; the space to the left and right (start and end) of it will be left empty.
wrap-margin
specifies how much margin you want left between the exclusion
element and the rest of the content.
wrap-padding
specifies how much padding you want left between the exclusion
element and the rest of the content.
If you have multiple exclusions interacting inside the same space, they should
wrap around one another in reverse order of how they are placed in the document.
See
http://dev.w3.org/csswg/css3-exclusions/#exclusions-order
for more details.
If you want your content to flow around a more complicated shape, you can
define what the shape of the exclusion will be using the shapes part of the Exclu-
sions spec: See
http://dev.w3.org/csswg/css3-exclusions/#shapes.
You'll be able
to create circles, ellipses, and so on to shape your exclusions or even base those
shapes on images.
