LibWeb: Resolve percentage line-height values before CSS inheritance

Percentage line-height values are relative to 1em (i.e the font-size
of the element). We have to resolve their computed values before
proceeding with inheritance.
This commit is contained in:
Andreas Kling 2023-03-12 16:09:30 +01:00
parent 7b55d79d3a
commit 7bb7d87807
Notes: sideshowbarker 2024-07-17 07:43:44 +09:00
3 changed files with 31 additions and 0 deletions

View File

@ -0,0 +1,8 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (1,1) content-size 798x52 children: not-inline
BlockContainer <body> at (10,10) content-size 780x34 children: not-inline
BlockContainer <div> at (11,11) content-size 778x32 children: inline
line 0 width: 552.109375, height: 32, bottom: 32, baseline: 27.992187
frag 0 from TextNode start: 0, length: 25, rect: [11,11 552.109375x32]
"The Linux Kernel Archives"
TextNode <#text>

View File

@ -0,0 +1,13 @@
<!DOCTYPE html><html><head><style>
* {
border: 1px solid black !important;
font-family: "SerenitySans";
}
html {
line-height: 200%;
font-size: 16px;
}
div {
font-size: 40px;
}
</style></head><body><div>The Linux Kernel Archives

View File

@ -1299,6 +1299,16 @@ void StyleComputer::absolutize_values(StyleProperties& style, DOM::Element const
auto root_font_size = root_element_font_size();
auto font_size = style.property(CSS::PropertyID::FontSize)->to_length().to_px(viewport_rect(), font_metrics, root_font_size, root_font_size);
// NOTE: Percentage line-height values are relative to the font-size of the element.
// We have to resolve them right away, so that the *computed* line-height is ready for inheritance.
// We can't simply absolutize *all* percentage values against the font size,
// because most percentages are relative to containing block metrics.
auto& line_height_value_slot = style.m_property_values[to_underlying(CSS::PropertyID::LineHeight)];
if (line_height_value_slot && line_height_value_slot->is_percentage()) {
line_height_value_slot = LengthStyleValue::create(
Length::make_px(font_size * line_height_value_slot->as_percentage().percentage().as_fraction()));
}
for (size_t i = 0; i < style.m_property_values.size(); ++i) {
auto& value_slot = style.m_property_values[i];
if (!value_slot)