1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-05-31 10:18:11 +00:00

LibWeb: Blockify pseudo elements that are flex items

When deciding on a box type transformation (blockify/inlinify) for a
pseudo element, we have to use the originating element as a reference
rather than the parent.

(The originating element *is* the parent for its pseudo elements.)
This commit is contained in:
Andreas Kling 2023-04-27 15:38:50 +02:00
parent 806e08425a
commit c0b4083b02
3 changed files with 40 additions and 3 deletions

View file

@ -1425,7 +1425,7 @@ enum class BoxTypeTransformation {
Inlinify,
};
static BoxTypeTransformation required_box_type_transformation(StyleProperties const& style, DOM::Element const& element, Optional<CSS::Selector::PseudoElement> const&)
static BoxTypeTransformation required_box_type_transformation(StyleProperties const& style, DOM::Element const& element, Optional<CSS::Selector::PseudoElement> const& pseudo_element)
{
// Absolute positioning or floating an element blockifies the boxs display type. [CSS2]
if (style.position() == CSS::Position::Absolute || style.position() == CSS::Position::Fixed || style.float_() != CSS::Float::None)
@ -1433,9 +1433,12 @@ static BoxTypeTransformation required_box_type_transformation(StyleProperties co
// FIXME: Containment in a ruby container inlinifies the boxs display type, as described in [CSS-RUBY-1].
// NOTE: If we're computing style for a pseudo-element, the effective parent will be the originating element itself, not its parent.
auto const* parent = pseudo_element.has_value() ? &element : element.parent_element();
// A parent with a grid or flex display value blockifies the boxs display type. [CSS-GRID-1] [CSS-FLEXBOX-1]
if (element.parent_element() && element.parent_element()->computed_css_values()) {
auto const& parent_display = element.parent_element()->computed_css_values()->display();
if (parent && parent->computed_css_values()) {
auto const& parent_display = parent->computed_css_values()->display();
if (parent_display.is_grid_inside() || parent_display.is_flex_inside())
return BoxTypeTransformation::Blockify;
}