LibWeb: Propagate border-box dimensions when getting max content width
Some checks are pending
CI / macOS, arm64, Sanitizer, Clang (push) Waiting to run
CI / Linux, x86_64, Fuzzers, Clang (push) Waiting to run
CI / Linux, x86_64, Sanitizer, GNU (push) Waiting to run
CI / Linux, x86_64, Sanitizer, Clang (push) Waiting to run
Package the js repl as a binary artifact / Linux, arm64 (push) Waiting to run
Package the js repl as a binary artifact / macOS, arm64 (push) Waiting to run
Package the js repl as a binary artifact / Linux, x86_64 (push) Waiting to run
Run test262 and test-wasm / run_and_update_results (push) Waiting to run
Lint Code / lint (push) Waiting to run
Label PRs with merge conflicts / auto-labeler (push) Waiting to run
Push notes / build (push) Waiting to run

This means that we now calculate the inner width correctly for `display:
inline-block` nodes when we have `box-sizing: border-box` and
`min-width`, as we would previously assume these dimensions were all `0`
This commit is contained in:
Callum Law 2025-08-19 15:56:02 +12:00 committed by Jelle Raaijmakers
commit 405c5ffa60
Notes: github-actions[bot] 2025-09-10 09:42:41 +00:00
3 changed files with 39 additions and 0 deletions

View file

@ -1484,10 +1484,18 @@ CSSPixels FormattingContext::calculate_max_content_width(Layout::Box const& box)
LayoutState throwaway_state;
auto const& actual_box_state = m_state.get(box);
auto& box_state = throwaway_state.get_mutable(box);
box_state.width_constraint = SizeConstraint::MaxContent;
box_state.set_indefinite_content_width();
box_state.border_left = actual_box_state.border_left;
box_state.padding_left = actual_box_state.padding_left;
box_state.border_right = actual_box_state.border_right;
box_state.padding_right = actual_box_state.padding_right;
auto context = const_cast<FormattingContext*>(this)->create_independent_formatting_context_if_needed(throwaway_state, LayoutMode::IntrinsicSizing, box);
if (!context) {
context = make<BlockFormattingContext>(throwaway_state, LayoutMode::IntrinsicSizing, as<BlockContainer>(box), nullptr);

View file

@ -0,0 +1,17 @@
Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-inline
BlockContainer <html> at [0,0] [0+0+0 800 0+0+0] [0+0+0 66 0+0+0] [BFC] children: not-inline
BlockContainer <body> at [8,8] [8+0+0 784 0+0+8] [8+0+0 50 0+0+8] children: inline
frag 0 from BlockContainer start: 0, length: 0, rect: [18,18 30x30] baseline: 23.796875
BlockContainer <div.min-width> at [18,18] inline-block [0+0+10 30 10+0+0] [0+0+10 30 10+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [18,18 6.34375x18] baseline: 13.796875
"1"
TextNode <#text> (not painted)
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x66]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x50]
PaintableWithLines (BlockContainer<DIV>.min-width) [8,8 50x50]
TextPaintable (TextNode<#text>)
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)
SC for BlockContainer<HTML> [0,0 800x66] [children: 0] (z-index: auto)

View file

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html>
<head>
<style>
.min-width {
background-color: red;
box-sizing: border-box;
display: inline-block;
height: 50px;
min-width: 50px;
padding: 10px;
}
</style>
</head><body><div class="min-width">1</div></body></html>