mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-04-27 10:07:15 +02:00
When setting `font-family: monospace;` in CSS, we have to interpret the keyword font sizes (small, medium, large, etc) as slightly smaller for historical reasons. Normally the medium font size is 16px, but for monospace it's 13px. The way this needs to behave is extremely strange: When encountering `font-family: monospace`, we have to go back and replay the CSS cascade as if the medium font size had been 13px all along. Otherwise relative values like 2em/200%/etc could have gotten lost in the inheritance chain. We implement this in a fairly naive way by explicitly checking for `font-family: monospace` (note: it has to be *exactly* like that, it can't be `font-family: monospace, Courier` or similar.) When encountered, we simply walk the element ancestors and re-run the cascade for the font-size property. This is clumsy and inefficient, but it does work for the common cases. Other browsers do more elaborate things that we should eventually care about as well, such as user-configurable font settings, per-language behavior, etc. For now, this is just something that allows us to handle more WPT tests where things fall apart due to unexpected font sizes. To learn more about the wonders of font-size, see this blog post: https://manishearth.github.io/blog/2017/08/10/font-size-an-unexpectedly-complex-css-property/
51 lines
2.5 KiB
Plaintext
51 lines
2.5 KiB
Plaintext
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
|
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
|
|
BlockContainer <body> at (8,8) content-size 784x140 children: not-inline
|
|
BlockContainer <(anonymous)> at (8,8) content-size 784x17 children: inline
|
|
InlineNode <span>
|
|
frag 0 from TextNode start: 0, length: 5, rect: [8,8 36.40625x17] baseline: 13.296875
|
|
"well "
|
|
TextNode <#text>
|
|
InlineNode <b>
|
|
frag 0 from TextNode start: 0, length: 6, rect: [44.40625,33 44.84375x17] baseline: 13.296875
|
|
"hello "
|
|
TextNode <#text>
|
|
InlineNode <i>
|
|
frag 0 from TextNode start: 0, length: 7, rect: [89.25,58 55.359375x17] baseline: 13.296875
|
|
"friends"
|
|
TextNode <#text>
|
|
TextNode <#text>
|
|
BlockContainer <div> at (8,25) content-size 784x123 children: not-inline
|
|
BlockContainer <(anonymous)> at (8,25) content-size 784x68 children: inline
|
|
BreakNode <br>
|
|
BreakNode <br>
|
|
BreakNode <br>
|
|
BreakNode <br>
|
|
BlockContainer <pre#out> at (8,106) content-size 784x42 children: inline
|
|
frag 0 from TextNode start: 0, length: 10, rect: [8,106 58.640625x14] baseline: 10.890625
|
|
"well: 8, 8"
|
|
frag 1 from TextNode start: 11, length: 13, rect: [8,120 77.46875x14] baseline: 10.890625
|
|
"hello: 44, 33"
|
|
frag 2 from TextNode start: 25, length: 15, rect: [8,134 91.78125x14] baseline: 10.890625
|
|
"friends: 44, 25"
|
|
TextNode <#text>
|
|
BlockContainer <(anonymous)> at (8,161) content-size 784x0 children: inline
|
|
TextNode <#text>
|
|
TextNode <#text>
|
|
|
|
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
|
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
|
|
PaintableWithLines (BlockContainer<BODY>) [8,8 784x140]
|
|
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x17]
|
|
PaintableWithLines (InlineNode<SPAN>)
|
|
TextPaintable (TextNode<#text>)
|
|
PaintableWithLines (InlineNode<B>)
|
|
TextPaintable (TextNode<#text>)
|
|
PaintableWithLines (InlineNode<I>)
|
|
TextPaintable (TextNode<#text>)
|
|
PaintableWithLines (BlockContainer<DIV>) [8,25 784x123]
|
|
PaintableWithLines (BlockContainer(anonymous)) [8,25 784x68]
|
|
PaintableWithLines (BlockContainer<PRE>#out) [8,106 784x42]
|
|
TextPaintable (TextNode<#text>)
|
|
PaintableWithLines (BlockContainer(anonymous)) [8,161 784x0]
|