Previously we were using the HTML parse_dimension_value method for the
height and width attributes of an SVG element. These attributes should
however be treated as css properties instead and thus also support
calc() and absolute units so we use the css parser for this instead.
Instead of special-casing FlexFormattingContext in the intrinsic sizing
layout helpers, add FormattingContext::automatic_content_width() and let
each context subclass decide what that means.
No behavior change here, just moving this responsibility.
Explicitly check is_viewport() instead of looking at the corresponding
DOM node. (The viewport has the DOM document as its DOM node, but that's
not obvious from context here.)
This fixes an issue where e.g `height: 100%` on a flex item whose
container has indefinite height was being resolved to 0. It now
correctly behaves the same as auto.
Previously, when having inline contexts consisting of just a `<br/>`
tag, we would not create a line box.
Ensure that there is always a line box when a line is explicitly being
broken and also ensure it won't be trimmed due to being empty.
This will a fix a number of sites that use `<br>` tags for layouts
between block elements (even though the spec says they shouldn't).
Before this patch, we would build full computed style for these pseudo
elements, for every DOM element, even if no ::before/::after selector
actually matched.
This was a colossal waste of time, and we can also just not do that.
Instead, just abort pseudo element style resolution early if no relevant
selectors matched. :^)
When we're calculating the intrinsic size of a flex container, we don't
*need* to layout the inside of each flex item. That's only necessary if
the flex items will be seen (as is the case for "normal" layout).
This avoids a whole bunch of unnecessary layout work on pages that use
flexbox layout. :^)
According to CSS Inline Layout Module Level 3 § 2.2 Step 1. atomic
inlines should be layed out in a line box based on their margin box.
However, up until this patch we were unconditionally considering only
the border box during line box height calculation. This made us
essentially drop all vertical margins for atomic inlines.
If normal flow layout has caused us to progress past the current
innermost float in the block axis, we still need to consider the floats
stacked outside of it.
Fix this by always walking the currently stacked floats from innermost
to outermost when placing new floats.
Until now we were just creating a stacking context for the tree root,
which usually is the viewport element. This lead to weird painting
behaviour when negative z-index children of the html element that
established their own stacking context were drawn below the canvas
background.
Now we establish a stacking context for both, the root element and the
viewport.
When using the flex shrink factor, the flexible length resolution
algorithm was incorrectly ignoring the `frozen` flag on items and would
update the same items again, causing overconsumption of the remaining
free space on the flex line.
In case flex items had `margin: auto` on the primary flex axis, we were
still also distributing remaining space according to `justify-content`
rules. This lead to duplicated spacing in various places and overflows.
It looks like this issue was observed previously but missidentified
because there was logic to ignore margins at the start and end which
would partially paper over the root cause. However this created other
bugs (like for example not having a margin at beginning and end ;-)) and
I can find nothing in the spec or other browser behaviour that indicates
that this is something that should be done.
Now we skip justify-content space distribution alltogether if it has
already been distributed to auto margins.
This fixes a bug in the CSS Grid when there is a column and/or row gap,
as previously it would take the index of the incorrect column when
finding the `AvailableSize`.
There is a mild complication in the GridFormattingContext as the
OccupationGrid does not take into account the gap columns and rows that
later appear in the `Vector<TemporaryTrack>` columns and rows. The
PositionedBoxes are kind of a connection between the two, and so it's
now more explicit whether you would like to refer to a column by its
position taking into the gap columns/rows or not.
The draft CSS-FLEXBOX-1 spec had a more detailed description of this
algorithm, so let's use that as our basis for the implementation.
Test by Aliaksandr. :^)
When resolving these constraints to CSS pixel sizes, we have to resolve
padding-top and padding-bottom against the flex container's *width*,
not its height.
The padding-top and padding-bottom properties are relative to the
*width* of the containing block, not the height.
It's funny how we keep making this same mistake again and again. :^)
This was necessary in the past, because IFC would set the height of its
containing block after inline layout.
Now that IFC can properly communicate the automatic size to its parent
formatting context, this hack is no longer necessary.
"Specified" means something else in CSS, so let's not use this
overloaded word here. These helpers return the inner main/cross size of
a given box, so let's say "inner" instead.
This moves color to be the first value resolved, this ensures that
calls to .to_color() on style values for other properties will always
be able to resolve the current color.
This change fixes the `background-color: currentColor` example in
colors.html.
The name "initial containing block" was wrong for this, as it doesn't
correspond to the HTML element, and that's specifically what it's
supposed to do! :^)