Jelajahi Sumber

LibWeb: Blockify `inline-flex` to `flex`

Previously, `inline-flex` would blockify to `block` since blockification
didn't take the inner display type into account. This is still not
perfect, but it fixes a lot of situations where inline-level flex
containers would be demoted to regular block containers.
Andreas Kling 3 tahun lalu
induk
melakukan
cf4b7e343a
1 mengubah file dengan 9 tambahan dan 2 penghapusan
  1. 9 2
      Userland/Libraries/LibWeb/CSS/StyleComputer.cpp

+ 9 - 2
Userland/Libraries/LibWeb/CSS/StyleComputer.cpp

@@ -1132,8 +1132,15 @@ void StyleComputer::transform_box_type_if_needed(StyleProperties& style, DOM::El
     case BoxTypeTransformation::None:
         break;
     case BoxTypeTransformation::Blockify:
-        if (!display.is_block_outside())
-            style.set_property(CSS::PropertyID::Display, IdentifierStyleValue::create(CSS::ValueID::Block));
+        if (!display.is_block_outside()) {
+            // FIXME: We only want to change the outer display type here, but we don't have a nice API
+            //        to do that specifically. For now, we simply check for "inline-flex" and convert
+            //        that to "flex".
+            if (display.is_flex_inside())
+                style.set_property(CSS::PropertyID::Display, IdentifierStyleValue::create(CSS::ValueID::Flex));
+            else
+                style.set_property(CSS::PropertyID::Display, IdentifierStyleValue::create(CSS::ValueID::Block));
+        }
         break;
     case BoxTypeTransformation::Inlinify:
         if (!display.is_inline_outside())