Created attachment 216017 [details]
HTML file highlighting the problem
When a float that has the size specified with percents is flowed through a region chain with multiple regions, the size of the float is computed relative to the sum of the sizes of the regions instead of the size of the region the float is rendered in.
Must double check for width, too and non-floats, too.
And we should check that when a float is fragmented, each fragment is sized relative to its individual region
I've investigated this a bit and it's not very straightforward to implement. The problem here is that the top position of a float depends on the width of a float.
For example, a left float will be positioned alongside other left floats as long as it still fits. This means you first need to determine the width and if the float doesn't fit, reposition it below the other floats. This is doable with regions but it implies a multi-step layout and important changes in the code. Instead of computing the width and the positioning the float you:
- first need to estimate the top
- compute the width in the region at that top offset
- if it doesn't fit, move it below the other floats
- recompute the width at the new top
CSS Regions were removed in Bug 174978.