Commit graph

2 commits

Author SHA1 Message Date
Patrick Walton
362b64aa68 Use the size of the containing block, not the size of the block formatting
context, to place floats in layout 2020.

The containing block for a float is not necessarily the same as the block
formatting context the float is in per CSS 2.1 [1]:

"For other elements, if the element’s position is relative or static, the
containing block is formed by the content edge of the nearest block container
ancestor box."

This shows up in the simplest case:

	<html>
	<body>
	<div style="float: left">Hello</div>
	</body>
	</html>

In this case, the `<html>` element is the block formatting context with inline
size equal to the width of the window, but the `<body>` element with nonzero
inline margins is the containing block for the float. The float placement must
respect the content box of the `<body>` element (i.e. floats must not overlap
the `<body>` element's margins), not that of the `<html>` element.

Because a single block formatting context may contain floats with different
containing blocks, the left and right "walls" of that containing block become
properties of individual floats at the time of placement, not properties of the
float context itself.

Additionally, this commit generalizes the float placement logic a bit to allow
the placement of arbitrary objects, not just floats. This is intended to
support inline layout and block formatting context placement.

This commit updates the `FloatContext` and associated tests only and doesn't
actually wire the context up to the rest of layout, so floats in pages still
aren't actually laid out.

[1]: https://drafts.csswg.org/css2/#containing-block-details
2020-07-22 19:58:28 -07:00
Patrick Walton
5b36d211b4 Add an implementation of the core float and clear placement logic in layout
2020, not yet wired to the rest of layout.

This commit implements an object that handles the 10 rules in CSS 2.1:

https://www.w3.org/TR/CSS2/visuren.html#float-position

The implementation strategy is that of a persistent balanced binary search tree
of float bands. Binary search trees are commonly used for implementing float
positioning; e.g. by WebKit.  Persistence enables each object that interacts
with floats to efficiently contain a snapshot of the float list at the time
that object was laid out. That way, incremental layout can invalidate and start
reflow at any point in a containing block.

This commit features extensive use of
[QuickCheck](https://github.com/BurntSushi/quickcheck) to ensure that the rules
of the CSS specification are followed.

Because this is not yet connected to layout, floats will not actually be laid
out in Web pages yet.

Note that unit tests as set up in Servo currently require types that they
access to be public. Therefore, some internal layout 2020 types that were
previously private have been made public. This is somewhat unfortunate.

Part of #25167.
2020-07-20 12:42:34 -07:00