1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-24 22:17:42 +00:00

LibWeb: Make CSSPixels and Length use 64-bit (double) floating point

This fixes a plethora of rounding problems on many websites.
In the future, we may want to replace this with fixed-point arithmetic
(bug #18566) for performance (and consistency with other engines),
but in the meantime this makes the web look a bit better. :^)

There's a lot more things that could be converted to doubles, which
would reduce the amount of casting necessary in this patch.
We can do that incrementally, however.
This commit is contained in:
Andreas Kling 2023-05-24 10:50:57 +02:00
parent 30262d7023
commit 655d9d1462
80 changed files with 298 additions and 299 deletions

View file

@ -24,45 +24,45 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
"the way" "the way"
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
BlockContainer <li#bar> at (235,55) content-size 139.977996x90 floating [BFC] children: not-inline BlockContainer <li#bar> at (235,55) content-size 139.977993x90 floating [BFC] children: not-inline
BlockContainer <(anonymous)> at (235,55) content-size 139.977996x0 children: inline BlockContainer <(anonymous)> at (235,55) content-size 139.977993x0 children: inline
TextNode <#text> TextNode <#text>
BlockContainer <p> at (235,55) content-size 139.977996x10 children: inline BlockContainer <p> at (235,55) content-size 139.977993x10 children: inline
line 0 width: 74.316406, height: 10, bottom: 10, baseline: 7.998046 line 0 width: 74.316406, height: 10, bottom: 10, baseline: 7.998046
frag 0 from TextNode start: 0, length: 14, rect: [235,55 74.316406x10] frag 0 from TextNode start: 0, length: 14, rect: [235,55 74.316406x10]
"the world ends" "the world ends"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (235,65) content-size 139.977996x0 children: inline BlockContainer <(anonymous)> at (235,65) content-size 139.977993x0 children: inline
TextNode <#text> TextNode <#text>
InlineNode <form> InlineNode <form>
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
BlockContainer <p> at (235,65) content-size 139.977996x19 children: inline BlockContainer <p> at (235,65) content-size 139.977993x18.999999 children: inline
line 0 width: 39.490234, height: 19, bottom: 19, baseline: 12.498046 line 0 width: 39.490234, height: 18.999999, bottom: 18.999999, baseline: 12.498046
frag 0 from TextNode start: 1, length: 5, rect: [235,65 27.490234x19] frag 0 from TextNode start: 1, length: 5, rect: [235,65 27.490234x18.999999]
"bang " "bang "
frag 1 from RadioButton start: 0, length: 0, rect: [262,65 12x12] frag 1 from RadioButton start: 0, length: 0, rect: [262,65 12x12]
TextNode <#text> TextNode <#text>
RadioButton <input> at (262,65) content-size 12x12 inline-block children: not-inline RadioButton <input> at (262,65) content-size 12x12 inline-block children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <p> at (235,84) content-size 139.977996x19 children: inline BlockContainer <p> at (235,83.999999) content-size 139.977993x18.999999 children: inline
line 0 width: 57.15625, height: 19, bottom: 19, baseline: 12.498046 line 0 width: 57.15625, height: 18.999999, bottom: 18.999999, baseline: 12.498046
frag 0 from TextNode start: 1, length: 8, rect: [235,84 45.15625x19] frag 0 from TextNode start: 1, length: 8, rect: [235,83.999999 45.15625x18.999999]
"whimper " "whimper "
frag 1 from RadioButton start: 0, length: 0, rect: [280,84 12x12] frag 1 from RadioButton start: 0, length: 0, rect: [280,83.999999 12x12]
TextNode <#text> TextNode <#text>
RadioButton <input> at (280,84) content-size 12x12 inline-block children: not-inline RadioButton <input> at (280,83.999999) content-size 12x12 inline-block children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (235,103) content-size 139.977996x0 children: inline BlockContainer <(anonymous)> at (235,102.999999) content-size 139.977993x0 children: inline
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
BlockContainer <li> at (409.977996,60) content-size 50x90 floating [BFC] children: inline BlockContainer <li> at (409.977993,60) content-size 50x90 floating [BFC] children: inline
line 0 width: 31.582031, height: 10, bottom: 10, baseline: 7.998046 line 0 width: 31.582031, height: 10, bottom: 10, baseline: 7.998046
frag 0 from TextNode start: 0, length: 6, rect: [409.977996,60 31.582031x10] frag 0 from TextNode start: 0, length: 6, rect: [409.977993,60 31.582031x10]
"i grow" "i grow"
line 1 width: 14.033203, height: 10, bottom: 20, baseline: 7.998046 line 1 width: 14.033203, height: 10, bottom: 20, baseline: 7.998046
frag 0 from TextNode start: 7, length: 3, rect: [409.977996,70 14.033203x10] frag 0 from TextNode start: 7, length: 3, rect: [409.977993,70 14.033203x10]
"old" "old"
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
@ -100,29 +100,29 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (20,30) content-size 480x0 children: inline BlockContainer <(anonymous)> at (20,30) content-size 480x0 children: inline
TextNode <#text> TextNode <#text>
BlockContainer <p> at (20,335) content-size 480x65 children: inline BlockContainer <p> at (20,335) content-size 480x64.999999 children: inline
line 0 width: 473.642578, height: 13, bottom: 13, baseline: 9.498046 line 0 width: 473.642578, height: 12.999999, bottom: 12.999999, baseline: 9.498046
frag 0 from TextNode start: 1, length: 90, rect: [20,335 473.642578x13] frag 0 from TextNode start: 1, length: 90, rect: [20,335 473.642578x12.999999]
"This is a nonsensical document, but syntactically valid HTML 4.0. All 100%-conformant CSS1" "This is a nonsensical document, but syntactically valid HTML 4.0. All 100%-conformant CSS1"
line 1 width: 396.953125, height: 13, bottom: 26, baseline: 9.498046 line 1 width: 396.953125, height: 13, bottom: 25.999999, baseline: 9.498046
frag 0 from TextNode start: 92, length: 74, rect: [20,348 396.953125x13] frag 0 from TextNode start: 92, length: 74, rect: [20,348 396.953125x12.999999]
"agents should be able to render the document elements above this paragraph" "agents should be able to render the document elements above this paragraph"
line 2 width: 470.585937, height: 13, bottom: 39, baseline: 9.498046 line 2 width: 470.585937, height: 13, bottom: 38.999999, baseline: 9.498046
frag 0 from TextNode start: 167, length: 43, rect: [20,361 207.900390x13] frag 0 from TextNode start: 167, length: 43, rect: [20,361 207.900390x12.999999]
"indistinguishably (to the pixel) from this " "indistinguishably (to the pixel) from this "
frag 1 from TextNode start: 0, length: 20, rect: [228,361 103.007812x13] frag 1 from TextNode start: 0, length: 20, rect: [228,361 103.007812x12.999999]
"reference rendering," "reference rendering,"
frag 2 from TextNode start: 0, length: 31, rect: [331,361 159.677734x13] frag 2 from TextNode start: 0, length: 31, rect: [331,361 159.677734x12.999999]
" (except font rasterization and" " (except font rasterization and"
line 3 width: 465.019531, height: 13, bottom: 52, baseline: 9.498046 line 3 width: 465.019531, height: 13.000000, bottom: 51.999999, baseline: 9.498046
frag 0 from TextNode start: 32, length: 89, rect: [20,374 465.019531x13] frag 0 from TextNode start: 32, length: 89, rect: [20,374 465.019531x12.999999]
"form widgets). All discrepancies should be traceable to CSS1 implementation shortcomings." "form widgets). All discrepancies should be traceable to CSS1 implementation shortcomings."
line 4 width: 408.164062, height: 13, bottom: 65, baseline: 9.498046 line 4 width: 408.164062, height: 13.000001, bottom: 64.999999, baseline: 9.498046
frag 0 from TextNode start: 122, length: 67, rect: [20,387 345.556640x13] frag 0 from TextNode start: 122, length: 67, rect: [20,387 345.556640x12.999999]
"Once you have finished evaluating this test, you can return to the " "Once you have finished evaluating this test, you can return to the "
frag 1 from TextNode start: 0, length: 11, rect: [366,387 59.892578x13] frag 1 from TextNode start: 0, length: 11, rect: [366,387 59.892578x12.999999]
"parent page" "parent page"
frag 2 from TextNode start: 0, length: 1, rect: [425,387 2.714843x13] frag 2 from TextNode start: 0, length: 1, rect: [425,387 2.714843x12.999999]
"." "."
TextNode <#text> TextNode <#text>
InlineNode <a> InlineNode <a>
@ -131,5 +131,5 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
InlineNode <a> InlineNode <a>
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (20,400) content-size 480x0 children: inline BlockContainer <(anonymous)> at (20,399.999999) content-size 480x0 children: inline
TextNode <#text> TextNode <#text>

View file

@ -1,9 +1,9 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (1,1) content-size 798x62.506248 [BFC] children: not-inline BlockContainer <html> at (1,1) content-size 798x62.50625 [BFC] children: not-inline
BlockContainer <body> at (2,2) content-size 796x60.506248 children: inline BlockContainer <body> at (2,2) content-size 796x60.50625 children: inline
line 0 width: 34, height: 28.50625, bottom: 28.50625, baseline: 28.50625 line 0 width: 34, height: 28.50625, bottom: 28.50625, baseline: 28.50625
frag 0 from BlockContainer start: 0, length: 0, rect: [4,3 30x30] frag 0 from BlockContainer start: 0, length: 0, rect: [4,3 30x30]
line 1 width: 32, height: 28.506248, bottom: 60.506248, baseline: 28.50625 line 1 width: 32, height: 28.50625, bottom: 60.50625, baseline: 28.50625
frag 0 from BlockContainer start: 0, length: 0, rect: [3,35 30x30] frag 0 from BlockContainer start: 0, length: 0, rect: [3,35 30x30]
BlockContainer <div.clump> at (4,3) content-size 30x30 inline-block [BFC] children: not-inline BlockContainer <div.clump> at (4,3) content-size 30x30 inline-block [BFC] children: not-inline
BreakNode <br> BreakNode <br>

View file

@ -6,13 +6,13 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
"Lorem" "Lorem"
frag 1 from TextNode start: 6, length: 1, rect: [618,10 12.553385x21.835937] frag 1 from TextNode start: 6, length: 1, rect: [618,10 12.553385x21.835937]
" " " "
frag 2 from TextNode start: 7, length: 5, rect: [630.553344,10 56.621093x21.835937] frag 2 from TextNode start: 7, length: 5, rect: [630.553385,10 56.621093x21.835937]
"ipsum" "ipsum"
frag 3 from TextNode start: 12, length: 1, rect: [686.553344,10 12.553385x21.835937] frag 3 from TextNode start: 12, length: 1, rect: [686.553385,10 12.553385x21.835937]
" " " "
frag 4 from TextNode start: 13, length: 5, rect: [699.106811,10 52.050781x21.835937] frag 4 from TextNode start: 13, length: 5, rect: [699.106770,10 52.050781x21.835937]
"dolor" "dolor"
frag 5 from TextNode start: 18, length: 1, rect: [751.106811,10 12.553385x21.835937] frag 5 from TextNode start: 18, length: 1, rect: [751.106770,10 12.553385x21.835937]
" " " "
frag 6 from TextNode start: 19, length: 3, rect: [763.660156,10 25.957031x21.835937] frag 6 from TextNode start: 19, length: 3, rect: [763.660156,10 25.957031x21.835937]
"sit" "sit"
@ -90,13 +90,13 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
"rutrum" "rutrum"
frag 1 from TextNode start: 166, length: 1, rect: [624,184 21.010416x21.835937] frag 1 from TextNode start: 166, length: 1, rect: [624,184 21.010416x21.835937]
" " " "
frag 2 from TextNode start: 167, length: 4, rect: [645.010375,184 35.097656x21.835937] frag 2 from TextNode start: 167, length: 4, rect: [645.010416,184 35.097656x21.835937]
"nisi" "nisi"
frag 3 from TextNode start: 171, length: 1, rect: [680.010375,184 21.010416x21.835937] frag 3 from TextNode start: 171, length: 1, rect: [680.010416,184 21.010416x21.835937]
" " " "
frag 4 from TextNode start: 172, length: 4, rect: [701.020874,184 39.824218x21.835937] frag 4 from TextNode start: 172, length: 4, rect: [701.020833,184 39.824218x21.835937]
"eget" "eget"
frag 5 from TextNode start: 176, length: 1, rect: [741.020874,184 21.010416x21.835937] frag 5 from TextNode start: 176, length: 1, rect: [741.020833,184 21.010416x21.835937]
" " " "
frag 6 from TextNode start: 177, length: 3, rect: [762.03125,184 27.734375x21.835937] frag 6 from TextNode start: 177, length: 3, rect: [762.03125,184 27.734375x21.835937]
"dui" "dui"
@ -181,15 +181,15 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
line 17 width: 231.074218, height: 22.210937, bottom: 376.585937, baseline: 16.914062 line 17 width: 231.074218, height: 22.210937, bottom: 376.585937, baseline: 16.914062
frag 0 from TextNode start: 328, length: 5, rect: [252,364 48.59375x21.835937] frag 0 from TextNode start: 328, length: 5, rect: [252,364 48.59375x21.835937]
"ante." "ante."
frag 1 from TextNode start: 333, length: 1, rect: [301,364 11.641926x21.835937] frag 1 from TextNode start: 333, length: 1, rect: [301,364 11.641927x21.835937]
" " " "
frag 2 from TextNode start: 334, length: 9, rect: [312.641937,364 94.765625x21.835937] frag 2 from TextNode start: 334, length: 9, rect: [312.641927,364 94.765625x21.835937]
"Phasellus" "Phasellus"
frag 3 from TextNode start: 343, length: 1, rect: [406.641906,364 11.641926x21.835937] frag 3 from TextNode start: 343, length: 1, rect: [406.641927,364 11.641927x21.835937]
" " " "
frag 4 from TextNode start: 344, length: 1, rect: [418.283874,364 11.679687x21.835937] frag 4 from TextNode start: 344, length: 1, rect: [418.283854,364 11.679687x21.835937]
"a" "a"
frag 5 from TextNode start: 345, length: 1, rect: [430.283874,364 11.641926x21.835937] frag 5 from TextNode start: 345, length: 1, rect: [430.283854,364 11.641927x21.835937]
" " " "
frag 6 from TextNode start: 346, length: 4, rect: [441.925781,364 46.035156x21.835937] frag 6 from TextNode start: 346, length: 4, rect: [441.925781,364 46.035156x21.835937]
"arcu" "arcu"

View file

@ -4,23 +4,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.container> at (9,9) content-size 500x102 flex-container(row) [FFC] children: not-inline Box <div.container> at (9,9) content-size 500x102 flex-container(row) [FFC] children: not-inline
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,10) content-size 164.666671x100 flex-item [BFC] children: inline BlockContainer <div.box> at (10,10) content-size 164.666666x100 flex-item [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (176.666671,10) content-size 164.666671x100 flex-item [BFC] children: inline BlockContainer <div.box> at (176.666666,10) content-size 164.666666x100 flex-item [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [176.666671,10 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [176.666666,10 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (343.333343,10) content-size 164.666671x100 flex-item [BFC] children: inline BlockContainer <div.box> at (343.333333,10) content-size 164.666666x100 flex-item [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [343.333343,10 9.09375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [343.333333,10 9.09375x17.46875]
"3" "3"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline

View file

@ -4,23 +4,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.container.column> at (9,9) content-size 782x250 flex-container(column) [FFC] children: not-inline Box <div.container.column> at (9,9) content-size 782x250 flex-container(column) [FFC] children: not-inline
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,10) content-size 100x81.333328 flex-item [BFC] children: inline BlockContainer <div.box> at (10,10) content-size 100x81.333333 flex-item [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,93.333328) content-size 100x81.333328 flex-item [BFC] children: inline BlockContainer <div.box> at (10,93.333333) content-size 100x81.333333 flex-item [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,93.333328 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,93.333333 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,176.666656) content-size 100x81.333328 flex-item [BFC] children: inline BlockContainer <div.box> at (10,176.666666) content-size 100x81.333333 flex-item [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,176.666656 9.09375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,176.666666 9.09375x17.46875]
"3" "3"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline

View file

@ -4,23 +4,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.container.column> at (9,9) content-size 250x250 flex-container(column) [FFC] children: not-inline Box <div.container.column> at (9,9) content-size 250x250 flex-container(column) [FFC] children: not-inline
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,10) content-size 100x81.333328 flex-item [BFC] children: inline BlockContainer <div.box> at (10,10) content-size 100x81.333333 flex-item [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,93.333328) content-size 100x81.333328 flex-item [BFC] children: inline BlockContainer <div.box> at (10,93.333333) content-size 100x81.333333 flex-item [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,93.333328 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,93.333333 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,176.666656) content-size 100x81.333328 flex-item [BFC] children: inline BlockContainer <div.box> at (10,176.666666) content-size 100x81.333333 flex-item [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,176.666656 9.09375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,176.666666 9.09375x17.46875]
"3" "3"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline

View file

@ -4,23 +4,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.container> at (9,9) content-size 782x250 flex-container(column) [FFC] children: not-inline Box <div.container> at (9,9) content-size 782x250 flex-container(column) [FFC] children: not-inline
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,10) content-size 100x81.333328 flex-item [BFC] children: inline BlockContainer <div.box> at (10,10) content-size 100x81.333333 flex-item [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,93.333328) content-size 100x81.333328 flex-item [BFC] children: inline BlockContainer <div.box> at (10,93.333333) content-size 100x81.333333 flex-item [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,93.333328 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,93.333333 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,176.666656) content-size 100x81.333328 flex-item [BFC] children: inline BlockContainer <div.box> at (10,176.666666) content-size 100x81.333333 flex-item [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,176.666656 9.09375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,176.666666 9.09375x17.46875]
"3" "3"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline

View file

@ -4,23 +4,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.container> at (9,9) content-size 250x102 flex-container(row) [FFC] children: not-inline Box <div.container> at (9,9) content-size 250x102 flex-container(row) [FFC] children: not-inline
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,10) content-size 81.333328x100 flex-item [BFC] children: inline BlockContainer <div.box> at (10,10) content-size 81.333333x100 flex-item [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (93.333328,10) content-size 81.333328x100 flex-item [BFC] children: inline BlockContainer <div.box> at (93.333333,10) content-size 81.333333x100 flex-item [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [93.333328,10 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [93.333333,10 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (176.666656,10) content-size 81.333328x100 flex-item [BFC] children: inline BlockContainer <div.box> at (176.666666,10) content-size 81.333333x100 flex-item [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [176.666656,10 9.09375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [176.666666,10 9.09375x17.46875]
"3" "3"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline

View file

@ -4,23 +4,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.container.width-constrained> at (9,9) content-size 250x102 flex-container(row) [FFC] children: not-inline Box <div.container.width-constrained> at (9,9) content-size 250x102 flex-container(row) [FFC] children: not-inline
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,10) content-size 81.333328x100 flex-item [BFC] children: inline BlockContainer <div.box> at (10,10) content-size 81.333333x100 flex-item [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (93.333328,10) content-size 81.333328x100 flex-item [BFC] children: inline BlockContainer <div.box> at (93.333333,10) content-size 81.333333x100 flex-item [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [93.333328,10 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [93.333333,10 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (176.666656,10) content-size 81.333328x100 flex-item [BFC] children: inline BlockContainer <div.box> at (176.666666,10) content-size 81.333333x100 flex-item [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [176.666656,10 9.09375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [176.666666,10 9.09375x17.46875]
"3" "3"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline

View file

@ -4,16 +4,16 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.container> at (9,9) content-size 500x102 flex-container(row) [FFC] children: not-inline Box <div.container> at (9,9) content-size 500x102 flex-container(row) [FFC] children: not-inline
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,10) content-size 229.333343x100 flex-item [BFC] children: inline BlockContainer <div.box> at (10,10) content-size 229.333333x100 flex-item [BFC] children: inline
line 0 width: 144.546875, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 144.546875, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 17, rect: [10,10 144.546875x17.46875] frag 0 from TextNode start: 0, length: 17, rect: [10,10 144.546875x17.46875]
"1 I grow the most" "1 I grow the most"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (241.333343,10) content-size 164.666671x100 flex-item [BFC] children: inline BlockContainer <div.box> at (241.333333,10) content-size 164.666666x100 flex-item [BFC] children: inline
line 0 width: 67.375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 67.375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 8, rect: [241.333343,10 67.375x17.46875] frag 0 from TextNode start: 0, length: 8, rect: [241.333333,10 67.375x17.46875]
"2 I grow" "2 I grow"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline

View file

@ -4,16 +4,16 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.container> at (9,9) content-size 500x102 flex-container(row) [FFC] children: not-inline Box <div.container> at (9,9) content-size 500x102 flex-container(row) [FFC] children: not-inline
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,10) content-size 82.333335x100 flex-item [BFC] children: inline BlockContainer <div.box> at (10,10) content-size 82.333333x100 flex-item [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (94.333335,10) content-size 164.666671x100 flex-item [BFC] children: inline BlockContainer <div.box> at (94.333333,10) content-size 164.666666x100 flex-item [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [94.333335,10 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [94.333333,10 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline

View file

@ -6,9 +6,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.flex-container> at (11,11) content-size 600x10 flex-container(row) [FFC] children: not-inline Box <div.flex-container> at (11,11) content-size 600x10 flex-container(row) [FFC] children: not-inline
BlockContainer <(anonymous)> at (11,11) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (11,11) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.flex-item> at (12,72) content-size 27.15625x18.000007 flex-item [BFC] children: inline BlockContainer <div.flex-item> at (12,71.999996) content-size 27.15625x18.000010 flex-item [BFC] children: inline
line 0 width: 27.15625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 27.15625, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 3, rect: [12,72 27.15625x17.46875] frag 0 from TextNode start: 0, length: 3, rect: [12,71.999996 27.15625x17.46875]
"foo" "foo"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (11,11) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (11,11) content-size 0x0 [BFC] children: inline

View file

@ -4,7 +4,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.container> at (9,9) content-size 250x102 flex-container(row) [FFC] children: not-inline Box <div.container> at (9,9) content-size 250x102 flex-container(row) [FFC] children: not-inline
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,10) content-size 62.666664x100 flex-item [BFC] children: inline BlockContainer <div.box> at (10,10) content-size 62.666666x100 flex-item [BFC] children: inline
line 0 width: 18.9375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 18.9375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 3, rect: [10,10 18.9375x17.46875] frag 0 from TextNode start: 0, length: 3, rect: [10,10 18.9375x17.46875]
"1 I" "1 I"
@ -20,9 +20,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (74.666664,10) content-size 81.333328x100 flex-item [BFC] children: inline BlockContainer <div.box> at (74.666666,10) content-size 81.333333x100 flex-item [BFC] children: inline
line 0 width: 78.765625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 78.765625, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 10, rect: [74.666664,10 78.765625x17.46875] frag 0 from TextNode start: 0, length: 10, rect: [74.666666,10 78.765625x17.46875]
"2 I shrink" "2 I shrink"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline

View file

@ -4,23 +4,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.container> at (9,9) content-size 500x102 flex-container(row) [FFC] children: not-inline Box <div.container> at (9,9) content-size 500x102 flex-container(row) [FFC] children: not-inline
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (10,10) content-size 47.000030x100 flex-item [BFC] children: inline BlockContainer <div.box> at (10,10) content-size 47.000011x100 flex-item [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [10,10 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (59.000030,10) content-size 164.666671x100 flex-item [BFC] children: inline BlockContainer <div.box> at (59.000011,10) content-size 164.666666x100 flex-item [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [59.000030,10 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [59.000011,10 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.box> at (225.666702,10) content-size 282.333312x100 flex-item [BFC] children: inline BlockContainer <div.box> at (225.666678,10) content-size 282.333321x100 flex-item [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [225.666702,10 9.09375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [225.666678,10 9.09375x17.46875]
"3" "3"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (9,9) content-size 0x0 [BFC] children: inline

View file

@ -1,6 +1,6 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (1,1) content-size 798x70 [BFC] children: not-inline BlockContainer <html> at (1,1) content-size 798x70 [BFC] children: not-inline
Box <body> at (10,10) content-size 780x52 flex-container(row) [FFC] children: not-inline Box <body> at (10,10) content-size 780x52 flex-container(row) [FFC] children: not-inline
ImageBox <img> at (11,11) content-size 66.666671x50 flex-item children: not-inline ImageBox <img> at (11,11) content-size 66.666668x50 flex-item children: not-inline
BlockContainer <(anonymous)> at (10,10) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (10,10) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>

View file

@ -4,7 +4,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.flex> at (11,11) content-size 300x200 flex-container(row) [FFC] children: not-inline Box <div.flex> at (11,11) content-size 300x200 flex-container(row) [FFC] children: not-inline
BlockContainer <div> at (12,12) content-size 100x20 flex-item [BFC] children: not-inline BlockContainer <div> at (12,12) content-size 100x20 flex-item [BFC] children: not-inline
BlockContainer <div> at (114,12) content-size 100x20 flex-item [BFC] children: not-inline BlockContainer <div> at (114,12) content-size 100x20 flex-item [BFC] children: not-inline
BlockContainer <div> at (12,95.333328) content-size 100x20 flex-item [BFC] children: not-inline BlockContainer <div> at (12,95.333333) content-size 100x20 flex-item [BFC] children: not-inline
BlockContainer <div> at (114,95.333328) content-size 100x20 flex-item [BFC] children: not-inline BlockContainer <div> at (114,95.333333) content-size 100x20 flex-item [BFC] children: not-inline
BlockContainer <div> at (12,178.666656) content-size 100x20 flex-item [BFC] children: not-inline BlockContainer <div> at (12,178.666666) content-size 100x20 flex-item [BFC] children: not-inline
BlockContainer <div> at (114,178.666656) content-size 100x20 flex-item [BFC] children: not-inline BlockContainer <div> at (114,178.666666) content-size 100x20 flex-item [BFC] children: not-inline

View file

@ -4,23 +4,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x17.46875 [GFC] children: not-inline Box <div.grid-container> at (8,8) content-size 784x17.46875 [GFC] children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (8,8) content-size 261.333343x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (8,8) content-size 261.333333x17.46875 [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (269.333343,8) content-size 261.333343x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (269.333333,8) content-size 261.333333x17.46875 [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [269.333343,8 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [269.333333,8 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (530.666687,8) content-size 261.333343x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (530.666666,8) content-size 261.333333x17.46875 [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [530.666687,8 9.09375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [530.666666,8 9.09375x17.46875]
"3" "3"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline

View file

@ -4,23 +4,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x17.46875 [GFC] children: not-inline Box <div.grid-container> at (8,8) content-size 784x17.46875 [GFC] children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (8,8) content-size 261.333343x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (8,8) content-size 261.333333x17.46875 [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (269.333343,8) content-size 261.333343x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (269.333333,8) content-size 261.333333x17.46875 [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [269.333343,8 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [269.333333,8 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (530.666687,8) content-size 261.333343x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (530.666666,8) content-size 261.333333x17.46875 [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [530.666687,8 9.09375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [530.666666,8 9.09375x17.46875]
"3" "3"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline

View file

@ -103,14 +103,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,275.34375) content-size 784x90.9375 [GFC] children: not-inline Box <div.grid-container> at (8,275.34375) content-size 784x90.9375 [GFC] children: not-inline
BlockContainer <(anonymous)> at (8,275.34375) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,275.34375) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (444.199981,285.34375) content-size 337.799987x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (444.199997,285.34375) content-size 337.800002x17.46875 [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [444.199981,285.34375 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [444.199997,285.34375 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,275.34375) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,275.34375) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (18,338.8125) content-size 337.799987x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (18,338.8125) content-size 337.800002x17.46875 [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [18,338.8125 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [18,338.8125 8.8125x17.46875]
"2" "2"

View file

@ -2,12 +2,12 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x50.9375 children: not-inline BlockContainer <body> at (8,8) content-size 784x50.9375 children: not-inline
Box <div.container> at (8,8) content-size 784x50.9375 [GFC] children: not-inline Box <div.container> at (8,8) content-size 784x50.9375 [GFC] children: not-inline
BlockContainer <div.item> at (434.199981,8) content-size 357.799987x17.46875 [BFC] children: inline BlockContainer <div.item> at (434.199997,8) content-size 357.800002x17.46875 [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [434.199981,8 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [434.199997,8 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <div.item> at (8,41.46875) content-size 357.799987x17.46875 [BFC] children: inline BlockContainer <div.item> at (8,41.46875) content-size 357.800002x17.46875 [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [8,41.46875 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [8,41.46875 8.8125x17.46875]
"2" "2"

View file

@ -2,12 +2,12 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x17.46875 children: not-inline BlockContainer <body> at (8,8) content-size 784x17.46875 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x17.46875 [GFC] children: not-inline Box <div.grid-container> at (8,8) content-size 784x17.46875 [GFC] children: not-inline
BlockContainer <div.first> at (8,8) content-size 313.599975x17.46875 [BFC] children: inline BlockContainer <div.first> at (8,8) content-size 313.599981x17.46875 [BFC] children: inline
line 0 width: 42.140625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 42.140625, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 5, rect: [8,8 42.140625x17.46875] frag 0 from TextNode start: 0, length: 5, rect: [8,8 42.140625x17.46875]
"First" "First"
TextNode <#text> TextNode <#text>
BlockContainer <div.second> at (400,8) content-size 78.399993x17.46875 [BFC] children: inline BlockContainer <div.second> at (400,8) content-size 78.399995x17.46875 [BFC] children: inline
line 0 width: 57.40625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 57.40625, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 6, rect: [400,8 57.40625x17.46875] frag 0 from TextNode start: 0, length: 6, rect: [400,8 57.40625x17.46875]
"Second" "Second"

View file

@ -1,14 +1,14 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x24.000022 children: not-inline BlockContainer <body> at (8,8) content-size 784x24 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x24.000022 [GFC] children: not-inline Box <div.grid-container> at (8,8) content-size 784x23.999999 [GFC] children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.wrapper> at (8,8) content-size 64.000061x24.000022 [BFC] children: inline BlockContainer <div.wrapper> at (8,8) content-size 64x23.999999 [BFC] children: inline
line 0 width: 64.000061, height: 24.000022, bottom: 24.000022, baseline: 24.000022 line 0 width: 64, height: 23.999999, bottom: 23.999999, baseline: 23.999999
frag 0 from ImageBox start: 0, length: 0, rect: [8,8 64.000061x24.000022] frag 0 from ImageBox start: 0, length: 0, rect: [8,8 64x23.999999]
TextNode <#text> TextNode <#text>
ImageBox <img> at (8,8) content-size 64.000061x24.000022 children: not-inline ImageBox <img> at (8,8) content-size 64x23.999999 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>

View file

@ -7,12 +7,12 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <div.item-left> at (8,8) content-size 100x35.40625 [BFC] children: not-inline BlockContainer <div.item-left> at (8,8) content-size 100x35.40625 [BFC] children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.item-right> at (108.000061,8) content-size 683.999938x35.40625 [BFC] children: inline BlockContainer <div.item-right> at (108,8) content-size 683.999999x35.40625 [BFC] children: inline
line 0 width: 625.953125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 625.953125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 77, rect: [108.000061,8 625.953125x17.46875] frag 0 from TextNode start: 0, length: 77, rect: [108,8 625.953125x17.46875]
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut iaculis venenatis" "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut iaculis venenatis"
line 1 width: 304.0625, height: 17.9375, bottom: 35.40625, baseline: 13.53125 line 1 width: 304.0625, height: 17.9375, bottom: 35.40625, baseline: 13.53125
frag 0 from TextNode start: 78, length: 39, rect: [108.000061,25 304.0625x17.46875] frag 0 from TextNode start: 78, length: 39, rect: [108,25 304.0625x17.46875]
"purus, eget blandit velit venenatis at." "purus, eget blandit velit venenatis at."
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline

View file

@ -25,30 +25,30 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,25.46875) content-size 784x75 [GFC] children: not-inline Box <div.grid-container> at (8,25.46875) content-size 784x75 [GFC] children: not-inline
BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (8,25.46875) content-size 261.333343x75 [BFC] children: inline BlockContainer <div.grid-item> at (8,25.46875) content-size 261.333333x75 [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [8,25.46875 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [8,25.46875 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (530.666687,25.46875) content-size 261.333343x50 [BFC] children: inline BlockContainer <div.grid-item> at (530.666666,25.46875) content-size 261.333333x50 [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [530.666687,25.46875 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [530.666666,25.46875 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (269.333343,25.46875) content-size 261.333343x25 [BFC] children: inline BlockContainer <div.grid-item> at (269.333333,25.46875) content-size 261.333333x25 [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [269.333343,25.46875 9.09375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [269.333333,25.46875 9.09375x17.46875]
"3" "3"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (269.333343,75.46875) content-size 522.666687x25 [BFC] children: inline BlockContainer <div.grid-item> at (269.333333,75.46875) content-size 522.666666x25 [BFC] children: inline
line 0 width: 7.75, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 7.75, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [269.333343,75.46875 7.75x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [269.333333,75.46875 7.75x17.46875]
"4" "4"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline

View file

@ -4,16 +4,16 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x17.46875 [GFC] children: not-inline Box <div.grid-container> at (8,8) content-size 784x17.46875 [GFC] children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (8,8) content-size 522.666687x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (8,8) content-size 522.666666x17.46875 [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (530.666687,8) content-size 261.333343x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (530.666666,8) content-size 261.333333x17.46875 [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [530.666687,8 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [530.666666,8 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline
@ -25,16 +25,16 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,25.46875) content-size 784x17.46875 [GFC] children: not-inline Box <div.grid-container> at (8,25.46875) content-size 784x17.46875 [GFC] children: not-inline
BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (8,25.46875) content-size 261.333343x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (8,25.46875) content-size 261.333333x17.46875 [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [8,25.46875 6.34375x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [8,25.46875 6.34375x17.46875]
"1" "1"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.grid-item> at (269.333343,25.46875) content-size 522.666687x17.46875 [BFC] children: inline BlockContainer <div.grid-item> at (269.333333,25.46875) content-size 522.666666x17.46875 [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [269.333343,25.46875 8.8125x17.46875] frag 0 from TextNode start: 0, length: 1, rect: [269.333333,25.46875 8.8125x17.46875]
"2" "2"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline

View file

@ -2,13 +2,13 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x17.46875 children: not-inline BlockContainer <body> at (8,8) content-size 784x17.46875 children: not-inline
Box <div.grid> at (8,8) content-size 784x17.46875 [GFC] children: not-inline Box <div.grid> at (8,8) content-size 784x17.46875 [GFC] children: not-inline
BlockContainer <div.item-left> at (8,8) content-size 261.333343x17.46875 [BFC] children: inline BlockContainer <div.item-left> at (8,8) content-size 261.333333x17.46875 [BFC] children: inline
line 0 width: 21.609375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 21.609375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 3, rect: [8,8 21.609375x17.46875] frag 0 from TextNode start: 0, length: 3, rect: [8,8 21.609375x17.46875]
"1fr" "1fr"
TextNode <#text> TextNode <#text>
BlockContainer <div.item-right> at (530.666687,8) content-size 261.333343x17.46875 [BFC] children: inline BlockContainer <div.item-right> at (530.666666,8) content-size 261.333333x17.46875 [BFC] children: inline
line 0 width: 21.609375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 21.609375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 3, rect: [530.666687,8 21.609375x17.46875] frag 0 from TextNode start: 0, length: 3, rect: [530.666666,8 21.609375x17.46875]
"1fr" "1fr"
TextNode <#text> TextNode <#text>

View file

@ -4,9 +4,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text> TextNode <#text>
BlockContainer <body> at (8,8) content-size 784x0 children: inline BlockContainer <body> at (8,8) content-size 784x0 children: inline
TextNode <#text> TextNode <#text>
BlockContainer <h1> at (76.590553,103.754333) content-size 126x38 positioned [BFC] children: inline BlockContainer <h1> at (76.590551,103.754331) content-size 126x38 positioned [BFC] children: inline
line 0 width: 46.523437, height: 21.835937, bottom: 21.835937, baseline: 16.914062 line 0 width: 46.523437, height: 21.835937, bottom: 21.835937, baseline: 16.914062
frag 0 from TextNode start: 0, length: 4, rect: [116.590553,103.754333 46.523437x21.835937] frag 0 from TextNode start: 0, length: 4, rect: [116.590551,103.754331 46.523437x21.835937]
"Test" "Test"
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>

View file

@ -100,6 +100,6 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text> TextNode <#text>
SVGSVGBox <svg> at (249,201) content-size 160x60 [SVG] children: inline SVGSVGBox <svg> at (249,201) content-size 160x60 [SVG] children: inline
TextNode <#text> TextNode <#text>
SVGGeometryBox <circle> at (299,201) content-size 60x60 children: not-inline SVGGeometryBox <circle> at (299,200.999998) content-size 60x60.000003 children: not-inline
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>

View file

@ -28,7 +28,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text> TextNode <#text>
SVGGraphicsBox <g> children: inline SVGGraphicsBox <g> children: inline
TextNode <#text> TextNode <#text>
SVGGeometryBox <path> at (84.5,159.504882) content-size 81x80.995117 children: not-inline SVGGeometryBox <path> at (84.5,159.504878) content-size 81x80.995117 children: not-inline
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
@ -43,15 +43,15 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text> TextNode <#text>
SVGGeometryBox <rect> at (506,90) content-size 120x120 children: not-inline SVGGeometryBox <rect> at (506,90) content-size 120x120 children: not-inline
TextNode <#text> TextNode <#text>
SVGGeometryBox <rect> at (471.358978,90) content-size 189.282043x120 children: not-inline SVGGeometryBox <rect> at (471.358985,90) content-size 189.282043x120 children: not-inline
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
SVGSVGBox <svg> at (50,250) content-size 200x200 [SVG] children: inline SVGSVGBox <svg> at (50,250) content-size 200x200 [SVG] children: inline
TextNode <#text> TextNode <#text>
SVGGeometryBox <rect> at (120.588233,320.588256) content-size 58.823524x58.823532 children: not-inline SVGGeometryBox <rect> at (120.588233,320.588241) content-size 58.823524x58.823532 children: not-inline
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
SVGGeometryBox <rect> at (52.443771,310.373657) content-size 68.144462x68.144454 children: not-inline SVGGeometryBox <rect> at (52.443771,310.373641) content-size 68.144462x68.144454 children: not-inline
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
SVGGeometryBox <rect> at (179.411773,321.481903) content-size 68.14447x68.14447 children: not-inline SVGGeometryBox <rect> at (179.411773,321.481903) content-size 68.14447x68.14447 children: not-inline
@ -76,7 +76,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text> TextNode <#text>
SVGGeometryBox <rect> at (506,290) content-size 120x120 children: not-inline SVGGeometryBox <rect> at (506,290) content-size 120x120 children: not-inline
TextNode <#text> TextNode <#text>
SVGGeometryBox <rect> at (506,255.358978) content-size 120x189.282043 children: not-inline SVGGeometryBox <rect> at (506,255.358985) content-size 120x189.282043 children: not-inline
TextNode <#text> TextNode <#text>
TextNode <#text> TextNode <#text>
SVGSVGBox <svg> at (50,450) content-size 200x200 [SVG] children: inline SVGSVGBox <svg> at (50,450) content-size 200x200 [SVG] children: inline

View file

@ -4,4 +4,4 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
line 0 width: 784, height: 784, bottom: 784, baseline: 784 line 0 width: 784, height: 784, bottom: 784, baseline: 784
frag 0 from SVGSVGBox start: 0, length: 0, rect: [8,8 784x784] frag 0 from SVGSVGBox start: 0, length: 0, rect: [8,8 784x784]
SVGSVGBox <svg> at (8,8) content-size 784x784 [SVG] children: not-inline SVGSVGBox <svg> at (8,8) content-size 784x784 [SVG] children: not-inline
SVGGeometryBox <rect> at (8,8) content-size 784x784 children: not-inline SVGGeometryBox <rect> at (7.999992,7.999992) content-size 784x784 children: not-inline

View file

@ -2,4 +2,4 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x800 [BFC] children: not-inline BlockContainer <html> at (0,0) content-size 800x800 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x784 children: not-inline BlockContainer <body> at (8,8) content-size 784x784 children: not-inline
SVGSVGBox <svg> at (8,8) content-size 784x784 [SVG] children: not-inline SVGSVGBox <svg> at (8,8) content-size 784x784 [SVG] children: not-inline
SVGGeometryBox <rect> at (8,8) content-size 784x784 children: not-inline SVGGeometryBox <rect> at (7.999992,7.999992) content-size 784x784 children: not-inline

View file

@ -6,9 +6,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <div.cb> at (11,11) content-size 600x10 children: not-inline BlockContainer <div.cb> at (11,11) content-size 600x10 children: not-inline
BlockContainer <(anonymous)> at (11,11) content-size 600x0 children: inline BlockContainer <(anonymous)> at (11,11) content-size 600x0 children: inline
TextNode <#text> TextNode <#text>
BlockContainer <div.foo> at (12,72) content-size 598x18.000007 children: inline BlockContainer <div.foo> at (12,71.999996) content-size 598x18.000010 children: inline
line 0 width: 27.15625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 line 0 width: 27.15625, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 3, rect: [12,72 27.15625x17.46875] frag 0 from TextNode start: 0, length: 3, rect: [12,71.999996 27.15625x17.46875]
"foo" "foo"
TextNode <#text> TextNode <#text>
BlockContainer <(anonymous)> at (11,211) content-size 600x17.46875 children: inline BlockContainer <(anonymous)> at (11,211) content-size 600x17.46875 children: inline

View file

@ -370,7 +370,7 @@ void GradientTool::draw_gradient(GUI::Painter& painter, bool with_guidelines, co
auto gradient_rect_width = determine_required_side_length(t_gradient_center.x(), width); auto gradient_rect_width = determine_required_side_length(t_gradient_center.x(), width);
auto gradient_max_side_length = AK::max(gradient_rect_height, gradient_rect_width); auto gradient_max_side_length = AK::max(gradient_rect_height, gradient_rect_width);
auto gradient_rect = Gfx::IntRect::centered_at(t_gradient_center, { gradient_max_side_length, gradient_max_side_length }); auto gradient_rect = Gfx::IntRect::centered_at(t_gradient_center, { gradient_max_side_length, gradient_max_side_length });
float overall_gradient_length_in_rect = Gfx::calculate_gradient_length(gradient_rect.size(), rotation_degrees - 90); float overall_gradient_length_in_rect = Gfx::calculate_gradient_length(gradient_rect.size().to_type<float>(), rotation_degrees - 90);
if (m_gradient_half_length == 0 || overall_gradient_length_in_rect == 0 || isnan(overall_gradient_length_in_rect)) if (m_gradient_half_length == 0 || overall_gradient_length_in_rect == 0 || isnan(overall_gradient_length_in_rect))
return; return;

View file

@ -135,7 +135,7 @@ struct BorderData {
public: public:
Color color { Color::Transparent }; Color color { Color::Transparent };
CSS::LineStyle line_style { CSS::LineStyle::None }; CSS::LineStyle line_style { CSS::LineStyle::None };
float width { 0 }; double width { 0 };
}; };
using TransformValue = Variant<CSS::AngleOrCalculated, CSS::LengthPercentage, float>; using TransformValue = Variant<CSS::AngleOrCalculated, CSS::LengthPercentage, float>;

View file

@ -12,7 +12,7 @@
namespace Web::CSS { namespace Web::CSS {
// https://www.w3.org/TR/CSS2/visufx.html#value-def-shape // https://www.w3.org/TR/CSS2/visufx.html#value-def-shape
Gfx::FloatRect EdgeRect::resolved(Layout::Node const& layout_node, Gfx::FloatRect border_box) const Gfx::FloatRect EdgeRect::resolved(Layout::Node const& layout_node, Gfx::Rect<double> border_box) const
{ {
// In CSS 2.1, the only valid <shape> value is: rect(<top>, <right>, <bottom>, <left>) where // In CSS 2.1, the only valid <shape> value is: rect(<top>, <right>, <bottom>, <left>) where
// <top> and <bottom> specify offsets from the top border edge of the box, and <right>, and // <top> and <bottom> specify offsets from the top border edge of the box, and <right>, and

View file

@ -19,7 +19,7 @@ struct EdgeRect {
Length right_edge; Length right_edge;
Length bottom_edge; Length bottom_edge;
Length left_edge; Length left_edge;
Gfx::FloatRect resolved(Layout::Node const&, Gfx::FloatRect) const; Gfx::FloatRect resolved(Layout::Node const&, Gfx::Rect<double>) const;
bool operator==(EdgeRect const&) const = default; bool operator==(EdgeRect const&) const = default;
}; };

View file

@ -14,7 +14,7 @@ GridSize::GridSize(LengthPercentage length_percentage)
: m_type(Type::LengthPercentage) : m_type(Type::LengthPercentage)
, m_length_percentage(length_percentage) {}; , m_length_percentage(length_percentage) {};
GridSize::GridSize(float flex_factor) GridSize::GridSize(double flex_factor)
: m_type(Type::FlexibleLength) : m_type(Type::FlexibleLength)
, m_length_percentage { Length::make_px(0) } , m_length_percentage { Length::make_px(0) }
, m_flex_factor(flex_factor) , m_flex_factor(flex_factor)

View file

@ -21,7 +21,7 @@ public:
}; };
GridSize(LengthPercentage); GridSize(LengthPercentage);
GridSize(float); GridSize(double);
GridSize(Type); GridSize(Type);
GridSize(); GridSize();
~GridSize(); ~GridSize();
@ -37,7 +37,7 @@ public:
bool is_min_content() const { return m_type == Type::MinContent; } bool is_min_content() const { return m_type == Type::MinContent; }
LengthPercentage length_percentage() const { return m_length_percentage; }; LengthPercentage length_percentage() const { return m_length_percentage; };
float flex_factor() const { return m_flex_factor; } double flex_factor() const { return m_flex_factor; }
// https://www.w3.org/TR/css-grid-2/#layout-algorithm // https://www.w3.org/TR/css-grid-2/#layout-algorithm
// An intrinsic sizing function (min-content, max-content, auto, fit-content()). // An intrinsic sizing function (min-content, max-content, auto, fit-content()).
@ -65,7 +65,7 @@ public:
private: private:
Type m_type; Type m_type;
LengthPercentage m_length_percentage; LengthPercentage m_length_percentage;
float m_flex_factor { 0 }; double m_flex_factor { 0 };
}; };
class GridMinMax { class GridMinMax {

View file

@ -35,7 +35,7 @@ Length::Length(int value, Type type)
, m_value(value) , m_value(value)
{ {
} }
Length::Length(float value, Type type) Length::Length(double value, Type type)
: m_type(type) : m_type(type)
, m_value(value) , m_value(value)
{ {
@ -59,7 +59,7 @@ Length Length::percentage_of(Percentage const& percentage) const
return *this; return *this;
} }
return Length { percentage.as_fraction() * raw_value(), m_type }; return Length { static_cast<double>(percentage.as_fraction()) * raw_value(), m_type };
} }
CSSPixels Length::font_relative_length_to_px(Length::FontMetrics const& font_metrics, Length::FontMetrics const& root_font_metrics) const CSSPixels Length::font_relative_length_to_px(Length::FontMetrics const& font_metrics, Length::FontMetrics const& root_font_metrics) const

View file

@ -83,7 +83,7 @@ public:
static Optional<Type> unit_from_name(StringView); static Optional<Type> unit_from_name(StringView);
Length(int value, Type type); Length(int value, Type type);
Length(float value, Type type); Length(double value, Type type);
~Length(); ~Length();
static Length make_auto(); static Length make_auto();
@ -154,7 +154,7 @@ public:
} }
Type type() const { return m_type; } Type type() const { return m_type; }
float raw_value() const { return m_value; } double raw_value() const { return m_value; }
CSSPixels to_px(Layout::Node const&) const; CSSPixels to_px(Layout::Node const&) const;
@ -171,8 +171,8 @@ public:
ALWAYS_INLINE CSSPixels absolute_length_to_px() const ALWAYS_INLINE CSSPixels absolute_length_to_px() const
{ {
constexpr float inch_pixels = 96.0f; constexpr double inch_pixels = 96.0;
constexpr float centimeter_pixels = (inch_pixels / 2.54f); constexpr double centimeter_pixels = (inch_pixels / 2.54);
switch (m_type) { switch (m_type) {
case Type::Cm: case Type::Cm:
return m_value * centimeter_pixels; // 1cm = 96px/2.54 return m_value * centimeter_pixels; // 1cm = 96px/2.54
@ -181,13 +181,13 @@ public:
case Type::Px: case Type::Px:
return m_value; // 1px = 1/96th of 1in return m_value; // 1px = 1/96th of 1in
case Type::Pt: case Type::Pt:
return m_value * ((1.0f / 72.0f) * inch_pixels); // 1pt = 1/72th of 1in return m_value * ((1.0 / 72.0) * inch_pixels); // 1pt = 1/72th of 1in
case Type::Pc: case Type::Pc:
return m_value * ((1.0f / 6.0f) * inch_pixels); // 1pc = 1/6th of 1in return m_value * ((1.0 / 6.0) * inch_pixels); // 1pc = 1/6th of 1in
case Type::Mm: case Type::Mm:
return m_value * ((1.0f / 10.0f) * centimeter_pixels); // 1mm = 1/10th of 1cm return m_value * ((1.0 / 10.0) * centimeter_pixels); // 1mm = 1/10th of 1cm
case Type::Q: case Type::Q:
return m_value * ((1.0f / 40.0f) * centimeter_pixels); // 1Q = 1/40th of 1cm return m_value * ((1.0 / 40.0) * centimeter_pixels); // 1Q = 1/40th of 1cm
default: default:
VERIFY_NOT_REACHED(); VERIFY_NOT_REACHED();
} }
@ -211,7 +211,7 @@ private:
char const* unit_name() const; char const* unit_name() const;
Type m_type; Type m_type;
float m_value { 0 }; double m_value { 0 };
}; };
} }

View file

@ -18,11 +18,11 @@ CSSPixelPoint PositionValue::resolved(Layout::Node const& node, CSSPixelRect con
return rect.width() * [&] { return rect.width() * [&] {
switch (preset) { switch (preset) {
case HorizontalPreset::Left: case HorizontalPreset::Left:
return 0.0f; return 0.;
case HorizontalPreset::Center: case HorizontalPreset::Center:
return 0.5f; return 0.5;
case HorizontalPreset::Right: case HorizontalPreset::Right:
return 1.0f; return 1.;
default: default:
VERIFY_NOT_REACHED(); VERIFY_NOT_REACHED();
} }
@ -36,11 +36,11 @@ CSSPixelPoint PositionValue::resolved(Layout::Node const& node, CSSPixelRect con
return rect.height() * [&] { return rect.height() * [&] {
switch (preset) { switch (preset) {
case VerticalPreset::Top: case VerticalPreset::Top:
return 0.0f; return 0.;
case VerticalPreset::Center: case VerticalPreset::Center:
return 0.5f; return 0.5;
case VerticalPreset::Bottom: case VerticalPreset::Bottom:
return 1.0f; return 1.;
default: default:
VERIFY_NOT_REACHED(); VERIFY_NOT_REACHED();
} }

View file

@ -1264,7 +1264,7 @@ void StyleComputer::compute_font(StyleProperties& style, DOM::Element const* ele
Optional<Length> maybe_length; Optional<Length> maybe_length;
if (font_size->is_percentage()) { if (font_size->is_percentage()) {
// Percentages refer to parent element's font size // Percentages refer to parent element's font size
maybe_length = Length::make_px(font_size->as_percentage().percentage().as_fraction() * parent_font_size()); maybe_length = Length::make_px(static_cast<double>(font_size->as_percentage().percentage().as_fraction()) * parent_font_size());
} else if (font_size->is_length()) { } else if (font_size->is_length()) {
maybe_length = font_size->to_length(); maybe_length = font_size->to_length();
@ -1438,7 +1438,7 @@ ErrorOr<void> StyleComputer::absolutize_values(StyleProperties& style, DOM::Elem
auto& line_height_value_slot = style.m_property_values[to_underlying(CSS::PropertyID::LineHeight)]; 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()) { if (line_height_value_slot && line_height_value_slot->is_percentage()) {
line_height_value_slot = TRY(LengthStyleValue::create( line_height_value_slot = TRY(LengthStyleValue::create(
Length::make_px(font_size * line_height_value_slot->as_percentage().percentage().as_fraction()))); Length::make_px(font_size * static_cast<double>(line_height_value_slot->as_percentage().percentage().as_fraction()))));
} }
auto line_height = style.line_height(viewport_rect(), font_metrics, m_root_element_font_metrics); auto line_height = style.line_height(viewport_rect(), font_metrics, m_root_element_font_metrics);

View file

@ -536,7 +536,7 @@ void CalculatedStyleValue::CalculationResult::multiply_by(CalculationResult cons
}, },
[&](Length const& length) { [&](Length const& length) {
VERIFY(layout_node); VERIFY(layout_node);
m_value = Length::make_px(length.to_px(*layout_node) * other.m_value.get<Number>().value()); m_value = Length::make_px(length.to_px(*layout_node) * static_cast<double>(other.m_value.get<Number>().value()));
}, },
[&](Time const& time) { [&](Time const& time) {
m_value = Time::make_seconds(time.to_seconds() * other.m_value.get<Number>().value()); m_value = Time::make_seconds(time.to_seconds() * other.m_value.get<Number>().value());
@ -569,7 +569,7 @@ void CalculatedStyleValue::CalculationResult::divide_by(CalculationResult const&
}, },
[&](Length const& length) { [&](Length const& length) {
VERIFY(layout_node); VERIFY(layout_node);
m_value = Length::make_px(length.to_px(*layout_node) / denominator); m_value = Length::make_px(length.to_px(*layout_node) / static_cast<double>(denominator));
}, },
[&](Time const& time) { [&](Time const& time) {
m_value = Time::make_seconds(time.to_seconds() / denominator); m_value = Time::make_seconds(time.to_seconds() / denominator);

View file

@ -30,7 +30,7 @@ Filter::DropShadow::Resolved Filter::DropShadow::resolved(Layout::Node const& no
return Resolved { return Resolved {
offset_x.to_px(node).value(), offset_x.to_px(node).value(),
offset_y.to_px(node).value(), offset_y.to_px(node).value(),
radius.has_value() ? radius->to_px(node).value() : 0.0f, radius.has_value() ? radius->to_px(node).value() : 0.0,
color.has_value() ? *color : node.computed_values().color() color.has_value() ? *color : node.computed_values().color()
}; };
} }

View file

@ -30,9 +30,9 @@ struct DropShadow {
Optional<Length> radius {}; Optional<Length> radius {};
Optional<Color> color {}; Optional<Color> color {};
struct Resolved { struct Resolved {
float offset_x; double offset_x;
float offset_y; double offset_y;
float radius; double radius;
Color color; Color color;
}; };
Resolved resolved(Layout::Node const&) const; Resolved resolved(Layout::Node const&) const;

View file

@ -146,12 +146,12 @@ Gfx::FloatSize RadialGradientStyleValue::resolve_size(Layout::Node const& node,
}, },
[&](CircleSize const& circle_size) { [&](CircleSize const& circle_size) {
auto radius = circle_size.radius.to_px(node); auto radius = circle_size.radius.to_px(node);
return Gfx::FloatSize { radius, radius }; return Gfx::FloatSize { radius.value(), radius.value() };
}, },
[&](EllipseSize const& ellipse_size) { [&](EllipseSize const& ellipse_size) {
auto radius_a = ellipse_size.radius_a.resolved(node, CSS::Length::make_px(size.width())).to_px(node); auto radius_a = ellipse_size.radius_a.resolved(node, CSS::Length::make_px(size.width())).to_px(node);
auto radius_b = ellipse_size.radius_b.resolved(node, CSS::Length::make_px(size.height())).to_px(node); auto radius_b = ellipse_size.radius_b.resolved(node, CSS::Length::make_px(size.height())).to_px(node);
return Gfx::FloatSize { radius_a, radius_b }; return Gfx::FloatSize { radius_a.value(), radius_b.value() };
}); });
// Handle degenerate cases // Handle degenerate cases
@ -187,8 +187,8 @@ Gfx::FloatSize RadialGradientStyleValue::resolve_size(Layout::Node const& node,
void RadialGradientStyleValue::resolve_for_size(Layout::Node const& node, CSSPixelSize paint_size) const void RadialGradientStyleValue::resolve_for_size(Layout::Node const& node, CSSPixelSize paint_size) const
{ {
CSSPixelRect gradient_box { { 0, 0 }, paint_size }; CSSPixelRect gradient_box { { 0, 0 }, paint_size };
auto center = m_properties.position.resolved(node, gradient_box).to_type<float>(); auto center = m_properties.position.resolved(node, gradient_box).to_type<double>().to_type<float>();
auto gradient_size = resolve_size(node, center, gradient_box.to_type<float>()); auto gradient_size = resolve_size(node, center, gradient_box.to_type<double>().to_type<float>());
if (m_resolved.has_value() && m_resolved->gradient_size == gradient_size) if (m_resolved.has_value() && m_resolved->gradient_size == gradient_size)
return; return;
m_resolved = ResolvedData { m_resolved = ResolvedData {

View file

@ -1811,7 +1811,7 @@ void Document::run_the_resize_steps()
if (!browsing_context()) if (!browsing_context())
return; return;
auto viewport_size = browsing_context()->viewport_rect().size().to_type<float>().to_type<int>(); auto viewport_size = browsing_context()->viewport_rect().size().to_type<double>().to_type<float>().to_type<int>();
if (m_last_viewport_size == viewport_size) if (m_last_viewport_size == viewport_size)
return; return;
m_last_viewport_size = viewport_size; m_last_viewport_size = viewport_size;

View file

@ -709,7 +709,7 @@ JS::NonnullGCPtr<Geometry::DOMRect> Element::get_bounding_client_rect() const
VERIFY(document().browsing_context()); VERIFY(document().browsing_context());
auto viewport_offset = document().browsing_context()->viewport_scroll_offset(); auto viewport_offset = document().browsing_context()->viewport_scroll_offset();
return Geometry::DOMRect::create(realm(), paintable_box->absolute_rect().translated(-viewport_offset.x(), -viewport_offset.y()).to_type<float>()).release_value_but_fixme_should_propagate_errors(); return Geometry::DOMRect::create(realm(), paintable_box->absolute_rect().translated(-viewport_offset.x(), -viewport_offset.y()).to_type<double>().to_type<float>()).release_value_but_fixme_should_propagate_errors();
} }
// https://drafts.csswg.org/cssom-view/#dom-element-getclientrects // https://drafts.csswg.org/cssom-view/#dom-element-getclientrects

View file

@ -338,7 +338,7 @@ SourceSet SourceSet::create(DOM::Document const& document, String default_source
bool contains_image_source_with_width_descriptor = false; bool contains_image_source_with_width_descriptor = false;
for (auto& source : source_set.m_sources) { for (auto& source : source_set.m_sources) {
if (source.descriptor.has<ImageSource::PixelDensityDescriptorValue>()) { if (source.descriptor.has<ImageSource::PixelDensityDescriptorValue>()) {
if (source.descriptor.get<ImageSource::PixelDensityDescriptorValue>().value == 1.0f) if (source.descriptor.get<ImageSource::PixelDensityDescriptorValue>().value == 1.0)
contains_image_source_with_pixel_density_descriptor_value_of_1 = true; contains_image_source_with_pixel_density_descriptor_value_of_1 = true;
} }
if (source.descriptor.has<ImageSource::WidthDescriptorValue>()) if (source.descriptor.has<ImageSource::WidthDescriptorValue>())

View file

@ -15,7 +15,7 @@ namespace Web::HTML {
// https://html.spec.whatwg.org/multipage/images.html#image-source // https://html.spec.whatwg.org/multipage/images.html#image-source
struct ImageSource { struct ImageSource {
struct PixelDensityDescriptorValue { struct PixelDensityDescriptorValue {
float value { 0 }; double value { 0 };
}; };
struct WidthDescriptorValue { struct WidthDescriptorValue {
@ -28,7 +28,7 @@ struct ImageSource {
struct ImageSourceAndPixelDensity { struct ImageSourceAndPixelDensity {
ImageSource source; ImageSource source;
float pixel_density { 1.0f }; double pixel_density { 1.0f };
}; };
// https://html.spec.whatwg.org/multipage/images.html#source-set // https://html.spec.whatwg.org/multipage/images.html#source-set

View file

@ -1077,7 +1077,7 @@ void Window::scroll(ScrollToOptions const& options)
// 1. If invoked with one argument, follow these substeps: // 1. If invoked with one argument, follow these substeps:
// 1. Let options be the argument. // 1. Let options be the argument.
auto viewport_rect = top_level_browsing_context.viewport_rect().to_type<float>(); auto viewport_rect = top_level_browsing_context.viewport_rect().to_type<double>().to_type<float>();
// 2. Let x be the value of the left dictionary member of options, if present, or the viewports current scroll // 2. Let x be the value of the left dictionary member of options, if present, or the viewports current scroll
// position on the x axis otherwise. // position on the x axis otherwise.

View file

@ -994,7 +994,7 @@ void BlockFormattingContext::layout_list_item_marker(ListItemBox const& list_ite
marker_state.set_content_height(max(image_height, marker.font().pixel_size_rounded_up() + 1).value()); marker_state.set_content_height(max(image_height, marker.font().pixel_size_rounded_up() + 1).value());
marker_state.set_content_offset({ -(marker_state.content_width() + default_marker_width), marker_state.set_content_offset({ -(marker_state.content_width() + default_marker_width),
max(CSSPixels(0.f), (CSSPixels(marker.line_height()) - marker_state.content_height()) / 2.f) }); max(CSSPixels(0), (CSSPixels(marker.line_height()) - marker_state.content_height()) / 2) });
if (marker_state.content_height() > list_item_state.content_height()) if (marker_state.content_height() > list_item_state.content_height())
list_item_state.set_content_height(marker_state.content_height()); list_item_state.set_content_height(marker_state.content_height());

View file

@ -577,7 +577,7 @@ CSS::FlexBasisData FlexFormattingContext::used_flex_basis_for_item(FlexItem cons
return flex_basis; return flex_basis;
} }
CSSPixels FlexFormattingContext::calculate_main_size_from_cross_size_and_aspect_ratio(CSSPixels cross_size, float aspect_ratio) const CSSPixels FlexFormattingContext::calculate_main_size_from_cross_size_and_aspect_ratio(CSSPixels cross_size, double aspect_ratio) const
{ {
if (is_row_layout()) if (is_row_layout())
return cross_size * aspect_ratio; return cross_size * aspect_ratio;
@ -717,7 +717,7 @@ void FlexFormattingContext::determine_flex_base_size_and_hypothetical_main_size(
// The hypothetical main size is the items flex base size clamped according to its used min and max main sizes (and flooring the content box size at zero). // The hypothetical main size is the items flex base size clamped according to its used min and max main sizes (and flooring the content box size at zero).
auto clamp_min = has_main_min_size(child_box) ? specified_main_min_size(child_box) : automatic_minimum_size(item); auto clamp_min = has_main_min_size(child_box) ? specified_main_min_size(child_box) : automatic_minimum_size(item);
auto clamp_max = has_main_max_size(child_box) ? specified_main_max_size(child_box) : NumericLimits<float>::max(); auto clamp_max = has_main_max_size(child_box) ? specified_main_max_size(child_box) : NumericLimits<float>::max();
item.hypothetical_main_size = max(CSSPixels(0.0f), css_clamp(item.flex_base_size, clamp_min, clamp_max)); item.hypothetical_main_size = max(CSSPixels(0), css_clamp(item.flex_base_size, clamp_min, clamp_max));
// NOTE: At this point, we set the hypothetical main size as the flex item's *temporary* main size. // NOTE: At this point, we set the hypothetical main size as the flex item's *temporary* main size.
// The size may change again when we resolve flexible lengths, but this is necessary in order for // The size may change again when we resolve flexible lengths, but this is necessary in order for
@ -1006,7 +1006,7 @@ void FlexFormattingContext::resolve_flexible_lengths_for_line(FlexLine& line)
for (auto& item : line.items) { for (auto& item : line.items) {
if (item.frozen) if (item.frozen)
continue; continue;
float ratio = item.flex_factor.value() / sum_of_flex_factor_of_unfrozen_items; double ratio = item.flex_factor.value() / sum_of_flex_factor_of_unfrozen_items;
// Set the items target main size to its flex base size plus a fraction of the remaining free space proportional to the ratio. // Set the items target main size to its flex base size plus a fraction of the remaining free space proportional to the ratio.
item.target_main_size = item.flex_base_size + (line.remaining_free_space * ratio); item.target_main_size = item.flex_base_size + (line.remaining_free_space * ratio);
} }
@ -1024,7 +1024,7 @@ void FlexFormattingContext::resolve_flexible_lengths_for_line(FlexLine& line)
if (item.frozen) if (item.frozen)
continue; continue;
// Find the ratio of the items scaled flex shrink factor to the sum of the scaled flex shrink factors of all unfrozen items on the line. // Find the ratio of the items scaled flex shrink factor to the sum of the scaled flex shrink factors of all unfrozen items on the line.
float ratio = 1.0f; double ratio = 1.0;
if (sum_of_scaled_flex_shrink_factors_of_all_unfrozen_items_on_line != 0) if (sum_of_scaled_flex_shrink_factors_of_all_unfrozen_items_on_line != 0)
ratio = item.scaled_flex_shrink_factor / sum_of_scaled_flex_shrink_factors_of_all_unfrozen_items_on_line; ratio = item.scaled_flex_shrink_factor / sum_of_scaled_flex_shrink_factors_of_all_unfrozen_items_on_line;
@ -1207,7 +1207,7 @@ void FlexFormattingContext::calculate_cross_size_of_each_flex_line()
} }
// 3. The used cross-size of the flex line is the largest of the numbers found in the previous two steps and zero. // 3. The used cross-size of the flex line is the largest of the numbers found in the previous two steps and zero.
flex_line.cross_size = max(CSSPixels(0.0f), largest_hypothetical_cross_size); flex_line.cross_size = max(CSSPixels(0), largest_hypothetical_cross_size);
} }
// If the flex container is single-line, then clamp the lines cross-size to be within the containers computed min and max cross sizes. // If the flex container is single-line, then clamp the lines cross-size to be within the containers computed min and max cross sizes.
@ -1276,7 +1276,7 @@ void FlexFormattingContext::distribute_any_remaining_free_space()
used_main_space += main_gap() * (flex_line.items.size() - 1); used_main_space += main_gap() * (flex_line.items.size() - 1);
if (flex_line.remaining_free_space > 0) { if (flex_line.remaining_free_space > 0) {
CSSPixels size_per_auto_margin = flex_line.remaining_free_space / (float)auto_margins; CSSPixels size_per_auto_margin = flex_line.remaining_free_space / static_cast<double>(auto_margins);
for (auto& item : flex_line.items) { for (auto& item : flex_line.items) {
if (item.margins.main_before_is_auto) if (item.margins.main_before_is_auto)
set_main_axis_first_margin(item, size_per_auto_margin); set_main_axis_first_margin(item, size_per_auto_margin);
@ -1317,7 +1317,7 @@ void FlexFormattingContext::distribute_any_remaining_free_space()
} }
break; break;
case CSS::JustifyContent::Center: case CSS::JustifyContent::Center:
initial_offset = (inner_main_size(flex_container()) - used_main_space) / 2.0f; initial_offset = (inner_main_size(flex_container()) - used_main_space) / 2.0;
if (is_direction_reverse()) { if (is_direction_reverse()) {
initial_offset = inner_main_size(flex_container()) - initial_offset; initial_offset = inner_main_size(flex_container()) - initial_offset;
} }
@ -1327,7 +1327,7 @@ void FlexFormattingContext::distribute_any_remaining_free_space()
break; break;
case CSS::JustifyContent::SpaceAround: case CSS::JustifyContent::SpaceAround:
space_between_items = flex_line.remaining_free_space / number_of_items; space_between_items = flex_line.remaining_free_space / number_of_items;
initial_offset = space_between_items / 2.0f; initial_offset = space_between_items / 2.0;
break; break;
} }
} }
@ -1443,7 +1443,7 @@ void FlexFormattingContext::align_all_flex_items_along_the_cross_axis()
// FIXME: Take better care of margins // FIXME: Take better care of margins
for (auto& flex_line : m_flex_lines) { for (auto& flex_line : m_flex_lines) {
for (auto& item : flex_line.items) { for (auto& item : flex_line.items) {
CSSPixels half_line_size = flex_line.cross_size / 2.0f; CSSPixels half_line_size = flex_line.cross_size / 2.0;
switch (alignment_for_item(item.box)) { switch (alignment_for_item(item.box)) {
case CSS::AlignItems::Baseline: case CSS::AlignItems::Baseline:
// FIXME: Implement this // FIXME: Implement this
@ -1456,7 +1456,7 @@ void FlexFormattingContext::align_all_flex_items_along_the_cross_axis()
item.cross_offset = half_line_size - item.cross_size.value() - item.margins.cross_after - item.borders.cross_after - item.padding.cross_after; item.cross_offset = half_line_size - item.cross_size.value() - item.margins.cross_after - item.borders.cross_after - item.padding.cross_after;
break; break;
case CSS::AlignItems::Center: case CSS::AlignItems::Center:
item.cross_offset = -(item.cross_size.value() / 2.0f); item.cross_offset = -(item.cross_size.value() / 2.0);
break; break;
default: default:
break; break;
@ -1511,7 +1511,7 @@ void FlexFormattingContext::align_all_flex_lines()
if (is_single_line()) { if (is_single_line()) {
// For single-line flex containers, we only need to center the line along the cross axis. // For single-line flex containers, we only need to center the line along the cross axis.
auto& flex_line = m_flex_lines[0]; auto& flex_line = m_flex_lines[0];
CSSPixels center_of_line = cross_size_of_flex_container / 2.0f; CSSPixels center_of_line = cross_size_of_flex_container / 2.0;
for (auto& item : flex_line.items) { for (auto& item : flex_line.items) {
item.cross_offset += center_of_line; item.cross_offset += center_of_line;
} }
@ -1711,9 +1711,9 @@ CSSPixels FlexFormattingContext::calculate_intrinsic_main_size_of_flex_container
// and the chosen flex fraction, then clamp that result by the max main size floored by the min main size. // and the chosen flex fraction, then clamp that result by the max main size floored by the min main size.
CSSPixels sum = 0; CSSPixels sum = 0;
for (auto& item : flex_line.items) { for (auto& item : flex_line.items) {
float product = 0; double product = 0;
if (item.desired_flex_fraction > 0) if (item.desired_flex_fraction > 0)
product = flex_line.chosen_flex_fraction * item.box->computed_values().flex_grow(); product = flex_line.chosen_flex_fraction * static_cast<double>(item.box->computed_values().flex_grow());
else if (item.desired_flex_fraction < 0) else if (item.desired_flex_fraction < 0)
product = flex_line.chosen_flex_fraction * item.scaled_flex_shrink_factor; product = flex_line.chosen_flex_fraction * item.scaled_flex_shrink_factor;
auto result = item.flex_base_size + product; auto result = item.flex_base_size + product;
@ -2036,8 +2036,8 @@ void FlexFormattingContext::resolve_cross_axis_auto_margins()
if (outer_cross_size < line.cross_size) { if (outer_cross_size < line.cross_size) {
CSSPixels remainder = line.cross_size - outer_cross_size; CSSPixels remainder = line.cross_size - outer_cross_size;
if (item.margins.cross_before_is_auto && item.margins.cross_after_is_auto) { if (item.margins.cross_before_is_auto && item.margins.cross_after_is_auto) {
item.margins.cross_before = remainder / 2.0f; item.margins.cross_before = remainder / 2.0;
item.margins.cross_after = remainder / 2.0f; item.margins.cross_after = remainder / 2.0;
} else if (item.margins.cross_before_is_auto) { } else if (item.margins.cross_before_is_auto) {
item.margins.cross_before = remainder; item.margins.cross_before = remainder;
} else { } else {
@ -2110,13 +2110,13 @@ CSSPixelPoint FlexFormattingContext::calculate_static_position(Box const& box) c
cross_offset = half_line_size - inner_cross_size(box) - cross_margin_after - cross_border_after - cross_padding_after; cross_offset = half_line_size - inner_cross_size(box) - cross_margin_after - cross_border_after - cross_padding_after;
break; break;
case CSS::AlignItems::Center: case CSS::AlignItems::Center:
cross_offset = -(inner_cross_size(box) / 2.0f); cross_offset = -(inner_cross_size(box) / 2.0);
break; break;
default: default:
break; break;
} }
cross_offset += inner_cross_size(flex_container()) / 2.0f; cross_offset += inner_cross_size(flex_container()) / 2.0;
// The main-axis edges of the static-position rectangle are where the margin edges of the child // The main-axis edges of the static-position rectangle are where the margin edges of the child
// would be positioned if it were the sole flex item in the flex container, // would be positioned if it were the sole flex item in the flex container,
@ -2161,7 +2161,7 @@ CSSPixelPoint FlexFormattingContext::calculate_static_position(Box const& box) c
break; break;
case CSS::JustifyContent::Center: case CSS::JustifyContent::Center:
case CSS::JustifyContent::SpaceAround: case CSS::JustifyContent::SpaceAround:
main_offset = inner_main_size(flex_container()) / 2.0f - inner_main_size(box) / 2.0f; main_offset = inner_main_size(flex_container()) / 2.0 - inner_main_size(box) / 2.0;
break; break;
} }
@ -2185,9 +2185,9 @@ CSSPixelPoint FlexFormattingContext::calculate_static_position(Box const& box) c
return static_position_offset + diff; return static_position_offset + diff;
} }
float FlexFormattingContext::FlexLine::sum_of_flex_factor_of_unfrozen_items() const double FlexFormattingContext::FlexLine::sum_of_flex_factor_of_unfrozen_items() const
{ {
float sum = 0; double sum = 0;
for (auto const& item : items) { for (auto const& item : items) {
if (!item.frozen) if (!item.frozen)
sum += item.flex_factor.value(); sum += item.flex_factor.value();
@ -2195,9 +2195,9 @@ float FlexFormattingContext::FlexLine::sum_of_flex_factor_of_unfrozen_items() co
return sum; return sum;
} }
float FlexFormattingContext::FlexLine::sum_of_scaled_flex_shrink_factor_of_unfrozen_items() const double FlexFormattingContext::FlexLine::sum_of_scaled_flex_shrink_factor_of_unfrozen_items() const
{ {
float sum = 0; double sum = 0;
for (auto const& item : items) { for (auto const& item : items) {
if (!item.frozen) if (!item.frozen)
sum += item.scaled_flex_shrink_factor; sum += item.scaled_flex_shrink_factor;

View file

@ -35,7 +35,7 @@ private:
[[nodiscard]] bool should_treat_cross_size_as_auto(Box const&) const; [[nodiscard]] bool should_treat_cross_size_as_auto(Box const&) const;
[[nodiscard]] CSSPixels adjust_main_size_through_aspect_ratio_for_cross_size_min_max_constraints(Box const&, CSSPixels main_size, CSS::Size const& min_cross_size, CSS::Size const& max_cross_size) const; [[nodiscard]] CSSPixels adjust_main_size_through_aspect_ratio_for_cross_size_min_max_constraints(Box const&, CSSPixels main_size, CSS::Size const& min_cross_size, CSS::Size const& max_cross_size) const;
[[nodiscard]] CSSPixels calculate_main_size_from_cross_size_and_aspect_ratio(CSSPixels cross_size, float aspect_ratio) const; [[nodiscard]] CSSPixels calculate_main_size_from_cross_size_and_aspect_ratio(CSSPixels cross_size, double aspect_ratio) const;
void dump_items() const; void dump_items() const;
@ -61,9 +61,9 @@ private:
CSSPixels hypothetical_cross_size_with_margins() { return hypothetical_cross_size + margins.cross_before + margins.cross_after + borders.cross_after + borders.cross_before + padding.cross_after + padding.cross_before; } CSSPixels hypothetical_cross_size_with_margins() { return hypothetical_cross_size + margins.cross_before + margins.cross_after + borders.cross_after + borders.cross_before + padding.cross_after + padding.cross_before; }
CSSPixels target_main_size { 0 }; CSSPixels target_main_size { 0 };
bool frozen { false }; bool frozen { false };
Optional<float> flex_factor {}; Optional<double> flex_factor {};
float scaled_flex_shrink_factor { 0 }; double scaled_flex_shrink_factor { 0 };
float desired_flex_fraction { 0 }; double desired_flex_fraction { 0 };
CSSPixels outer_hypothetical_main_size() const CSSPixels outer_hypothetical_main_size() const
{ {
@ -109,10 +109,10 @@ private:
Vector<FlexItem&> items; Vector<FlexItem&> items;
CSSPixels cross_size { 0 }; CSSPixels cross_size { 0 };
CSSPixels remaining_free_space { 0 }; CSSPixels remaining_free_space { 0 };
float chosen_flex_fraction { 0 }; double chosen_flex_fraction { 0 };
float sum_of_flex_factor_of_unfrozen_items() const; double sum_of_flex_factor_of_unfrozen_items() const;
float sum_of_scaled_flex_shrink_factor_of_unfrozen_items() const; double sum_of_scaled_flex_shrink_factor_of_unfrozen_items() const;
}; };
CSSPixels main_gap() const; CSSPixels main_gap() const;

View file

@ -391,7 +391,7 @@ CSSPixels FormattingContext::tentative_width_for_replaced_element(LayoutState co
// (used height) * (intrinsic ratio) // (used height) * (intrinsic ratio)
if ((computed_height.is_auto() && computed_width.is_auto() && !box.has_intrinsic_width() && box.has_intrinsic_height() && box.has_intrinsic_aspect_ratio()) if ((computed_height.is_auto() && computed_width.is_auto() && !box.has_intrinsic_width() && box.has_intrinsic_height() && box.has_intrinsic_aspect_ratio())
|| (computed_width.is_auto() && !computed_height.is_auto() && box.has_intrinsic_aspect_ratio())) { || (computed_width.is_auto() && !computed_height.is_auto() && box.has_intrinsic_aspect_ratio())) {
return compute_height_for_replaced_element(state, box, available_space) * box.intrinsic_aspect_ratio().value(); return compute_height_for_replaced_element(state, box, available_space) * static_cast<double>(box.intrinsic_aspect_ratio().value());
} }
// If 'height' and 'width' both have computed values of 'auto' and the element has an intrinsic ratio but no intrinsic height or width, // If 'height' and 'width' both have computed values of 'auto' and the element has an intrinsic ratio but no intrinsic height or width,
@ -486,7 +486,7 @@ CSSPixels FormattingContext::tentative_height_for_replaced_element(LayoutState c
// //
// (used width) / (intrinsic ratio) // (used width) / (intrinsic ratio)
if (computed_height.is_auto() && box.has_intrinsic_aspect_ratio()) if (computed_height.is_auto() && box.has_intrinsic_aspect_ratio())
return state.get(box).content_width() / box.intrinsic_aspect_ratio().value(); return state.get(box).content_width() / static_cast<double>(box.intrinsic_aspect_ratio().value());
// Otherwise, if 'height' has a computed value of 'auto', and the element has an intrinsic height, then that intrinsic height is the used value of 'height'. // Otherwise, if 'height' has a computed value of 'auto', and the element has an intrinsic height, then that intrinsic height is the used value of 'height'.
if (computed_height.is_auto() && box.has_intrinsic_height()) if (computed_height.is_auto() && box.has_intrinsic_height())
@ -1280,7 +1280,7 @@ CSSPixels FormattingContext::calculate_min_content_height(Layout::Box const& box
CSSPixels FormattingContext::calculate_max_content_height(Layout::Box const& box, AvailableSize const& available_width) const CSSPixels FormattingContext::calculate_max_content_height(Layout::Box const& box, AvailableSize const& available_width) const
{ {
if (box.has_intrinsic_aspect_ratio() && available_width.is_definite()) if (box.has_intrinsic_aspect_ratio() && available_width.is_definite())
return available_width.to_px() / *box.intrinsic_aspect_ratio(); return available_width.to_px() / static_cast<double>(*box.intrinsic_aspect_ratio());
if (box.has_intrinsic_height()) if (box.has_intrinsic_height())
return *box.intrinsic_height(); return *box.intrinsic_height();

View file

@ -751,7 +751,7 @@ void GridFormattingContext::resolve_intrinsic_track_sizes(AvailableSpace const&
// 5. If any track still has an infinite growth limit (because, for example, it had no items placed in // 5. If any track still has an infinite growth limit (because, for example, it had no items placed in
// it or it is a flexible track), set its growth limit to its base size. // it or it is a flexible track), set its growth limit to its base size.
for (auto& track : tracks_and_gaps) { for (auto& track : tracks_and_gaps) {
if (track.growth_limit == INFINITY) { if (!isfinite(track.growth_limit.value())) {
track.growth_limit = track.base_size; track.growth_limit = track.base_size;
} }
} }
@ -774,7 +774,7 @@ void GridFormattingContext::distribute_extra_space_across_spanned_tracks_base_si
// 2. Distribute space up to limits: // 2. Distribute space up to limits:
// FIXME: If a fixed-point type were used to represent CSS pixels, it would be possible to compare with 0 // FIXME: If a fixed-point type were used to represent CSS pixels, it would be possible to compare with 0
// instead of epsilon. // instead of epsilon.
while (extra_space > NumericLimits<float>().epsilon()) { while (extra_space > NumericLimits<double>().epsilon()) {
auto all_frozen = all_of(spanned_tracks, [](auto const& track) { return track.base_size_frozen; }); auto all_frozen = all_of(spanned_tracks, [](auto const& track) { return track.base_size_frozen; });
if (all_frozen) if (all_frozen)
break; break;
@ -816,7 +816,7 @@ void GridFormattingContext::distribute_extra_space_across_spanned_tracks_growth_
// 1. Find the space to distribute: // 1. Find the space to distribute:
CSSPixels spanned_tracks_sizes_sum = 0; CSSPixels spanned_tracks_sizes_sum = 0;
for (auto& track : spanned_tracks) { for (auto& track : spanned_tracks) {
if (track.growth_limit != INFINITY) { if (isfinite(track.growth_limit.value())) {
spanned_tracks_sizes_sum += track.growth_limit; spanned_tracks_sizes_sum += track.growth_limit;
} else { } else {
spanned_tracks_sizes_sum += track.base_size; spanned_tracks_sizes_sum += track.base_size;
@ -830,7 +830,7 @@ void GridFormattingContext::distribute_extra_space_across_spanned_tracks_growth_
// 2. Distribute space up to limits: // 2. Distribute space up to limits:
// FIXME: If a fixed-point type were used to represent CSS pixels, it would be possible to compare with 0 // FIXME: If a fixed-point type were used to represent CSS pixels, it would be possible to compare with 0
// instead of epsilon. // instead of epsilon.
while (extra_space > NumericLimits<float>().epsilon()) { while (extra_space > NumericLimits<double>().epsilon()) {
auto all_frozen = all_of(spanned_tracks, [](auto const& track) { return track.growth_limit_frozen; }); auto all_frozen = all_of(spanned_tracks, [](auto const& track) { return track.growth_limit_frozen; });
if (all_frozen) if (all_frozen)
break; break;
@ -957,7 +957,7 @@ void GridFormattingContext::increase_sizes_to_accommodate_spanning_items_crossin
} }
distribute_extra_space_across_spanned_tracks_growth_limit(item_min_content_contribution, intrinsic_maximum_tracks); distribute_extra_space_across_spanned_tracks_growth_limit(item_min_content_contribution, intrinsic_maximum_tracks);
for (auto& track : spanned_tracks) { for (auto& track : spanned_tracks) {
if (track.growth_limit == INFINITY) { if (!isfinite(track.growth_limit.value())) {
// If the affected size is an infinite growth limit, set it to the tracks base size plus the planned increase. // If the affected size is an infinite growth limit, set it to the tracks base size plus the planned increase.
track.growth_limit = track.base_size + track.planned_increase; track.growth_limit = track.base_size + track.planned_increase;
// Mark any tracks whose growth limit changed from infinite to finite in this step as infinitely growable // Mark any tracks whose growth limit changed from infinite to finite in this step as infinitely growable
@ -982,7 +982,7 @@ void GridFormattingContext::increase_sizes_to_accommodate_spanning_items_crossin
auto item_max_content_contribution = calculate_max_content_contribution(item, dimension); auto item_max_content_contribution = calculate_max_content_contribution(item, dimension);
distribute_extra_space_across_spanned_tracks_growth_limit(item_max_content_contribution, max_content_maximum_tracks); distribute_extra_space_across_spanned_tracks_growth_limit(item_max_content_contribution, max_content_maximum_tracks);
for (auto& track : spanned_tracks) { for (auto& track : spanned_tracks) {
if (track.growth_limit == INFINITY) { if (!isfinite(track.growth_limit.value())) {
// If the affected size is an infinite growth limit, set it to the tracks base size plus the planned increase. // If the affected size is an infinite growth limit, set it to the tracks base size plus the planned increase.
track.growth_limit = track.base_size + track.planned_increase; track.growth_limit = track.base_size + track.planned_increase;
} else { } else {
@ -1058,7 +1058,7 @@ void GridFormattingContext::maximize_tracks(AvailableSpace const& available_spac
while (free_space_px > 0) { while (free_space_px > 0) {
auto free_space_to_distribute_per_track = free_space_px / tracks.size(); auto free_space_to_distribute_per_track = free_space_px / tracks.size();
for (auto& track : tracks) { for (auto& track : tracks) {
VERIFY(track.growth_limit != INFINITY); VERIFY(isfinite(track.growth_limit.value()));
track.base_size = min(track.growth_limit, track.base_size + free_space_to_distribute_per_track); track.base_size = min(track.growth_limit, track.base_size + free_space_to_distribute_per_track);
} }
if (get_free_space_px() == free_space_px) if (get_free_space_px() == free_space_px)

View file

@ -18,7 +18,7 @@
namespace Web::Layout { namespace Web::Layout {
constexpr float text_justification_threshold = 0.1; constexpr double text_justification_threshold = 0.1;
InlineFormattingContext::InlineFormattingContext(LayoutState& state, BlockContainer const& containing_block, BlockFormattingContext& parent) InlineFormattingContext::InlineFormattingContext(LayoutState& state, BlockContainer const& containing_block, BlockFormattingContext& parent)
: FormattingContext(Type::Inline, state, containing_block, &parent) : FormattingContext(Type::Inline, state, containing_block, &parent)
@ -209,7 +209,7 @@ void InlineFormattingContext::apply_justification_to_fragments(CSS::TextJustify
} }
} }
CSSPixels justified_space_width = whitespace_count > 0 ? (excess_horizontal_space_including_whitespace / static_cast<float>(whitespace_count)) : 0; CSSPixels justified_space_width = whitespace_count > 0 ? (excess_horizontal_space_including_whitespace / static_cast<double>(whitespace_count)) : 0;
// This is the amount that each fragment will be offset by. If a whitespace // This is the amount that each fragment will be offset by. If a whitespace
// fragment is shorter than the justified space width, it increases to push // fragment is shorter than the justified space width, it increases to push

View file

@ -320,7 +320,7 @@ void LayoutState::UsedValues::set_node(NodeWithStyleAndBoxModelMetrics& node, Us
if (size.is_percentage()) { if (size.is_percentage()) {
if (containing_block_has_definite_size) { if (containing_block_has_definite_size) {
auto containing_block_size = width ? containing_block_used_values->content_width() : containing_block_used_values->content_height(); auto containing_block_size = width ? containing_block_used_values->content_width() : containing_block_used_values->content_height();
resolved_definite_size = adjust_for_box_sizing(containing_block_size * size.percentage().as_fraction(), size, width); resolved_definite_size = adjust_for_box_sizing(containing_block_size * static_cast<double>(size.percentage().as_fraction()), size, width);
return true; return true;
} }
return false; return false;

View file

@ -223,7 +223,7 @@ void LineBuilder::update_last_line()
if (length_percentage->is_length()) if (length_percentage->is_length())
fragment_baseline += length_percentage->length().to_px(fragment.layout_node()); fragment_baseline += length_percentage->length().to_px(fragment.layout_node());
else if (length_percentage->is_percentage()) else if (length_percentage->is_percentage())
fragment_baseline += length_percentage->percentage().as_fraction() * line_height; fragment_baseline += static_cast<double>(length_percentage->percentage().as_fraction()) * line_height;
} }
line_box_baseline = max(line_box_baseline, fragment_baseline); line_box_baseline = max(line_box_baseline, fragment_baseline);
@ -277,7 +277,7 @@ void LineBuilder::update_last_line()
auto vertical_align_amount = length_percentage->length().to_px(fragment.layout_node()); auto vertical_align_amount = length_percentage->length().to_px(fragment.layout_node());
new_fragment_y = y_value_for_alignment(CSS::VerticalAlign::Baseline) - vertical_align_amount; new_fragment_y = y_value_for_alignment(CSS::VerticalAlign::Baseline) - vertical_align_amount;
} else if (length_percentage->is_percentage()) { } else if (length_percentage->is_percentage()) {
auto vertical_align_amount = length_percentage->percentage().as_fraction() * m_context.containing_block().line_height(); auto vertical_align_amount = static_cast<double>(length_percentage->percentage().as_fraction()) * m_context.containing_block().line_height();
new_fragment_y = y_value_for_alignment(CSS::VerticalAlign::Baseline) - vertical_align_amount; new_fragment_y = y_value_for_alignment(CSS::VerticalAlign::Baseline) - vertical_align_amount;
} }
} }
@ -305,7 +305,7 @@ void LineBuilder::update_last_line()
if (length_percentage->is_length()) if (length_percentage->is_length())
bottom_of_inline_box += length_percentage->length().to_px(fragment.layout_node()); bottom_of_inline_box += length_percentage->length().to_px(fragment.layout_node());
else if (length_percentage->is_percentage()) else if (length_percentage->is_percentage())
bottom_of_inline_box += length_percentage->percentage().as_fraction() * m_context.containing_block().line_height(); bottom_of_inline_box += static_cast<double>(length_percentage->percentage().as_fraction()) * m_context.containing_block().line_height();
} }
} }

View file

@ -609,7 +609,7 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
if (border.line_style == CSS::LineStyle::None || border.line_style == CSS::LineStyle::Hidden) { if (border.line_style == CSS::LineStyle::None || border.line_style == CSS::LineStyle::Hidden) {
border.width = 0; border.width = 0;
} else { } else {
auto resolve_border_width = [&]() { auto resolve_border_width = [&]() -> double {
auto value = computed_style.property(width_property); auto value = computed_style.property(width_property);
if (value->is_calculated()) if (value->is_calculated())
return value->as_calculated().resolve_length(*this)->to_px(*this).value(); return value->as_calculated().resolve_length(*this)->to_px(*this).value();
@ -619,11 +619,11 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
// https://www.w3.org/TR/css-backgrounds-3/#valdef-line-width-thin // https://www.w3.org/TR/css-backgrounds-3/#valdef-line-width-thin
switch (value->to_identifier()) { switch (value->to_identifier()) {
case CSS::ValueID::Thin: case CSS::ValueID::Thin:
return 1.0f; return 1.0;
case CSS::ValueID::Medium: case CSS::ValueID::Medium:
return 3.0f; return 3.0;
case CSS::ValueID::Thick: case CSS::ValueID::Thick:
return 5.0f; return 5.0;
default: default:
VERIFY_NOT_REACHED(); VERIFY_NOT_REACHED();
} }

View file

@ -35,7 +35,7 @@ CSSPixels SVGFormattingContext::automatic_content_height() const
struct ViewBoxTransform { struct ViewBoxTransform {
CSSPixelPoint offset; CSSPixelPoint offset;
float scale_factor; double scale_factor;
}; };
// https://svgwg.org/svg2-draft/coords.html#PreserveAspectRatioAttribute // https://svgwg.org/svg2-draft/coords.html#PreserveAspectRatioAttribute
@ -156,7 +156,7 @@ void SVGFormattingContext::run(Box const& box, LayoutMode layout_mode, Available
auto& path = dom_node.get_path(); auto& path = dom_node.get_path();
auto path_transform = dom_node.get_transform(); auto path_transform = dom_node.get_transform();
float viewbox_scale = 1; double viewbox_scale = 1;
auto& maybe_view_box = svg_svg_element.view_box(); auto& maybe_view_box = svg_svg_element.view_box();
if (maybe_view_box.has_value()) { if (maybe_view_box.has_value()) {
// FIXME: This should allow just one of width or height to be specified. // FIXME: This should allow just one of width or height to be specified.
@ -172,13 +172,13 @@ void SVGFormattingContext::run(Box const& box, LayoutMode layout_mode, Available
// The initial value for preserveAspectRatio is xMidYMid meet. // The initial value for preserveAspectRatio is xMidYMid meet.
auto preserve_aspect_ratio = svg_svg_element.preserve_aspect_ratio().value_or(SVG::PreserveAspectRatio {}); auto preserve_aspect_ratio = svg_svg_element.preserve_aspect_ratio().value_or(SVG::PreserveAspectRatio {});
auto viewbox_transform = scale_and_align_viewbox_content(preserve_aspect_ratio, view_box, { scale_width, scale_height }, svg_box_state); auto viewbox_transform = scale_and_align_viewbox_content(preserve_aspect_ratio, view_box, { scale_width, scale_height }, svg_box_state);
path_transform = Gfx::AffineTransform {}.translate(viewbox_transform.offset.to_type<float>()).scale(viewbox_transform.scale_factor, viewbox_transform.scale_factor).translate({ -view_box.min_x, -view_box.min_y }).multiply(path_transform); path_transform = Gfx::AffineTransform {}.translate(viewbox_transform.offset.to_type<double>().to_type<float>()).scale(viewbox_transform.scale_factor, viewbox_transform.scale_factor).translate({ -view_box.min_x, -view_box.min_y }).multiply(path_transform);
viewbox_scale = viewbox_transform.scale_factor; viewbox_scale = viewbox_transform.scale_factor;
} }
// Stroke increases the path's size by stroke_width/2 per side. // Stroke increases the path's size by stroke_width/2 per side.
auto path_bounding_box = path_transform.map(path.bounding_box()).to_type<CSSPixels>(); auto path_bounding_box = path_transform.map(path.bounding_box()).to_type<CSSPixels>();
CSSPixels stroke_width = geometry_box.dom_node().visible_stroke_width() * viewbox_scale; CSSPixels stroke_width = static_cast<double>(geometry_box.dom_node().visible_stroke_width()) * viewbox_scale;
path_bounding_box.inflate(stroke_width, stroke_width); path_bounding_box.inflate(stroke_width, stroke_width);
geometry_box_state.set_content_offset(path_bounding_box.top_left()); geometry_box_state.set_content_offset(path_bounding_box.top_left());
geometry_box_state.set_content_width(path_bounding_box.width()); geometry_box_state.set_content_width(path_bounding_box.width());

View file

@ -30,8 +30,8 @@ Optional<Gfx::AffineTransform> SVGGeometryBox::layout_transform() const
auto& geometry_element = dom_node(); auto& geometry_element = dom_node();
auto transform = geometry_element.get_transform(); auto transform = geometry_element.get_transform();
auto* svg_box = geometry_element.first_ancestor_of_type<SVG::SVGSVGElement>(); auto* svg_box = geometry_element.first_ancestor_of_type<SVG::SVGSVGElement>();
float scaling = 1; double scaling = 1;
auto origin = viewbox_origin().to_type<float>(); auto origin = viewbox_origin().to_type<double>().to_type<float>();
Gfx::FloatPoint paint_offset = {}; Gfx::FloatPoint paint_offset = {};
if (svg_box && svg_box->view_box().has_value()) { if (svg_box && svg_box->view_box().has_value()) {
// Note: SVGFormattingContext has already done the scaling based on the viewbox, // Note: SVGFormattingContext has already done the scaling based on the viewbox,
@ -45,9 +45,9 @@ Optional<Gfx::AffineTransform> SVGGeometryBox::layout_transform() const
return {}; return {};
auto scaled_width = paintable_box()->content_width().value(); auto scaled_width = paintable_box()->content_width().value();
auto scaled_height = paintable_box()->content_height().value(); auto scaled_height = paintable_box()->content_height().value();
scaling = min(scaled_width / original_bounding_box.width(), scaled_height / original_bounding_box.height()); scaling = min(scaled_width / static_cast<double>(original_bounding_box.width()), scaled_height / static_cast<double>(original_bounding_box.height()));
auto scaled_bounding_box = original_bounding_box.scaled(scaling, scaling); auto scaled_bounding_box = original_bounding_box.scaled(scaling, scaling);
paint_offset = (paintable_box()->absolute_rect().location() - svg_box->paintable_box()->absolute_rect().location()).to_type<float>() - scaled_bounding_box.location(); paint_offset = (paintable_box()->absolute_rect().location() - svg_box->paintable_box()->absolute_rect().location()).to_type<double>().to_type<float>() - scaled_bounding_box.location();
} }
return Gfx::AffineTransform {}.translate(paint_offset).scale(scaling, scaling).translate(-origin).multiply(transform); return Gfx::AffineTransform {}.translate(paint_offset).scale(scaling, scaling).translate(-origin).multiply(transform);
} }

View file

@ -56,7 +56,7 @@ private:
CSSPixels min_width { 0 }; CSSPixels min_width { 0 };
CSSPixels max_width { 0 }; CSSPixels max_width { 0 };
CSSPixels used_width { 0 }; CSSPixels used_width { 0 };
float percentage_width { 0 }; double percentage_width { 0 };
}; };
struct Row { struct Row {

View file

@ -105,12 +105,11 @@ CSSPixelRect Page::device_to_css_rect(DevicePixelRect rect) const
DevicePixelRect Page::enclosing_device_rect(CSSPixelRect rect) const DevicePixelRect Page::enclosing_device_rect(CSSPixelRect rect) const
{ {
auto scale = client().device_pixels_per_css_pixel(); auto scale = client().device_pixels_per_css_pixel();
return { return DevicePixelRect(
floorf(rect.x().value() * scale), floor(rect.x().value() * scale),
floorf(rect.y().value() * scale), floor(rect.y().value() * scale),
ceilf(rect.width().value() * scale), ceil(rect.width().value() * scale),
ceilf(rect.height().value() * scale) ceil(rect.height().value() * scale));
};
} }
DevicePixelRect Page::rounded_device_rect(CSSPixelRect rect) const DevicePixelRect Page::rounded_device_rect(CSSPixelRect rect) const

View file

@ -166,7 +166,7 @@ public:
virtual bool is_connection_open() const = 0; virtual bool is_connection_open() const = 0;
virtual Gfx::Palette palette() const = 0; virtual Gfx::Palette palette() const = 0;
virtual DevicePixelRect screen_rect() const = 0; virtual DevicePixelRect screen_rect() const = 0;
virtual float device_pixels_per_css_pixel() const = 0; virtual double device_pixels_per_css_pixel() const = 0;
virtual CSS::PreferredColorScheme preferred_color_scheme() const = 0; virtual CSS::PreferredColorScheme preferred_color_scheme() const = 0;
virtual void paint(DevicePixelRect const&, Gfx::Bitmap&) = 0; virtual void paint(DevicePixelRect const&, Gfx::Bitmap&) = 0;
virtual void page_did_change_title(DeprecatedString const&) { } virtual void page_did_change_title(DeprecatedString const&) { }

View file

@ -148,16 +148,16 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
CSSPixelRect image_rect; CSSPixelRect image_rect;
switch (layer.size_type) { switch (layer.size_type) {
case CSS::BackgroundSize::Contain: { case CSS::BackgroundSize::Contain: {
float max_width_ratio = (background_positioning_area.width() / natural_image_width).value(); double max_width_ratio = (background_positioning_area.width() / natural_image_width).value();
float max_height_ratio = (background_positioning_area.height() / natural_image_height).value(); double max_height_ratio = (background_positioning_area.height() / natural_image_height).value();
float ratio = min(max_width_ratio, max_height_ratio); double ratio = min(max_width_ratio, max_height_ratio);
image_rect.set_size(natural_image_width * ratio, natural_image_height * ratio); image_rect.set_size(natural_image_width * ratio, natural_image_height * ratio);
break; break;
} }
case CSS::BackgroundSize::Cover: { case CSS::BackgroundSize::Cover: {
float max_width_ratio = (background_positioning_area.width() / natural_image_width).value(); double max_width_ratio = (background_positioning_area.width() / natural_image_width).value();
float max_height_ratio = (background_positioning_area.height() / natural_image_height).value(); double max_height_ratio = (background_positioning_area.height() / natural_image_height).value();
float ratio = max(max_width_ratio, max_height_ratio); double ratio = max(max_width_ratio, max_height_ratio);
image_rect.set_size(natural_image_width * ratio, natural_image_height * ratio); image_rect.set_size(natural_image_width * ratio, natural_image_height * ratio);
break; break;
} }
@ -253,7 +253,7 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
repeat_x = false; repeat_x = false;
} else { } else {
auto space = fmod(background_positioning_area.width(), image_rect.width()); auto space = fmod(background_positioning_area.width(), image_rect.width());
x_step = image_rect.width() + (space / (float)(whole_images - 1)); x_step = image_rect.width() + (space / static_cast<double>(whole_images - 1));
repeat_x = true; repeat_x = true;
} }
break; break;
@ -284,7 +284,7 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
repeat_y = false; repeat_y = false;
} else { } else {
auto space = fmod(background_positioning_area.height(), image_rect.height()); auto space = fmod(background_positioning_area.height(), image_rect.height());
y_step = image_rect.height() + ((float)space / (float)(whole_images - 1)); y_step = image_rect.height() + (static_cast<double>(space) / static_cast<double>(whole_images - 1));
repeat_y = true; repeat_y = true;
} }
break; break;

View file

@ -33,14 +33,14 @@ BorderRadiiData normalized_border_radii_data(Layout::Node const& node, CSSPixelR
// Scale overlapping curves according to https://www.w3.org/TR/css-backgrounds-3/#corner-overlap // Scale overlapping curves according to https://www.w3.org/TR/css-backgrounds-3/#corner-overlap
CSSPixels f = 1.0f; CSSPixels f = 1.0f;
auto width_reciprocal = 1.0f / rect.width().value(); auto width_reciprocal = 1.0 / rect.width().value();
auto height_reciprocal = 1.0f / rect.height().value(); auto height_reciprocal = 1.0 / rect.height().value();
f = max(f, width_reciprocal * (top_left_radius_px.horizontal_radius + top_right_radius_px.horizontal_radius)); f = max(f, width_reciprocal * (top_left_radius_px.horizontal_radius + top_right_radius_px.horizontal_radius));
f = max(f, height_reciprocal * (top_right_radius_px.vertical_radius + bottom_right_radius_px.vertical_radius)); f = max(f, height_reciprocal * (top_right_radius_px.vertical_radius + bottom_right_radius_px.vertical_radius));
f = max(f, width_reciprocal * (bottom_left_radius_px.horizontal_radius + bottom_right_radius_px.horizontal_radius)); f = max(f, width_reciprocal * (bottom_left_radius_px.horizontal_radius + bottom_right_radius_px.horizontal_radius));
f = max(f, height_reciprocal * (top_left_radius_px.vertical_radius + bottom_left_radius_px.vertical_radius)); f = max(f, height_reciprocal * (top_left_radius_px.vertical_radius + bottom_left_radius_px.vertical_radius));
f = 1.0f / f.value(); f = 1.0 / f.value();
top_left_radius_px.horizontal_radius *= f; top_left_radius_px.horizontal_radius *= f;
top_left_radius_px.vertical_radius *= f; top_left_radius_px.vertical_radius *= f;
@ -149,8 +149,8 @@ void paint_border(PaintContext& context, BorderEdge edge, DevicePixelRect const&
auto draw_border = [&](auto const& border, auto const& radius, auto const& opposite_border, auto const& opposite_radius, auto p1_step_translate, auto p2_step_translate) { auto draw_border = [&](auto const& border, auto const& radius, auto const& opposite_border, auto const& opposite_radius, auto p1_step_translate, auto p2_step_translate) {
auto [p1, p2] = points_for_edge(edge, rect); auto [p1, p2] = points_for_edge(edge, rect);
auto p1_step = radius ? 0 : border.width / static_cast<float>(device_pixel_width.value()); auto p1_step = radius ? 0 : border.width / device_pixel_width.value();
auto p2_step = opposite_radius ? 0 : opposite_border.width / static_cast<float>(device_pixel_width.value()); auto p2_step = opposite_radius ? 0 : opposite_border.width / device_pixel_width.value();
for (DevicePixels i = 0; i < device_pixel_width; ++i) { for (DevicePixels i = 0; i < device_pixel_width; ++i) {
draw_horizontal_or_vertical_line(p1, p2); draw_horizontal_or_vertical_line(p1, p2);
p1_step_translate(p1, p1_step); p1_step_translate(p1, p1_step);

View file

@ -111,11 +111,11 @@ static ColorStopData resolve_color_stop_positions(auto const& color_stop_list, a
LinearGradientData resolve_linear_gradient_data(Layout::Node const& node, CSSPixelSize gradient_size, CSS::LinearGradientStyleValue const& linear_gradient) LinearGradientData resolve_linear_gradient_data(Layout::Node const& node, CSSPixelSize gradient_size, CSS::LinearGradientStyleValue const& linear_gradient)
{ {
auto gradient_angle = linear_gradient.angle_degrees(gradient_size); auto gradient_angle = linear_gradient.angle_degrees(gradient_size);
auto gradient_length_px = Gfx::calculate_gradient_length(gradient_size, gradient_angle); auto gradient_length_px = Gfx::calculate_gradient_length(gradient_size.to_type<double>().to_type<float>(), gradient_angle);
auto resolved_color_stops = resolve_color_stop_positions( auto resolved_color_stops = resolve_color_stop_positions(
linear_gradient.color_stop_list(), [&](auto const& length_percentage) { linear_gradient.color_stop_list(), [&](auto const& length_percentage) {
return length_percentage.to_px(node, gradient_length_px).value() / gradient_length_px; return length_percentage.to_px(node, gradient_length_px).value() / static_cast<double>(gradient_length_px);
}, },
linear_gradient.is_repeating()); linear_gradient.is_repeating());

View file

@ -32,10 +32,10 @@ void MarkerPaintable::paint(PaintContext& context, PaintPhase phase) const
return; return;
// FIXME: All this does is round to the nearest whole CSS pixel, but it's goofy. // FIXME: All this does is round to the nearest whole CSS pixel, but it's goofy.
CSSPixelRect enclosing = absolute_rect().to_type<float>().to_rounded<float>().to_type<CSSPixels>(); CSSPixelRect enclosing = absolute_rect().to_type<double>().to_type<float>().to_rounded<float>().to_type<CSSPixels>();
auto device_enclosing = context.enclosing_device_rect(enclosing); auto device_enclosing = context.enclosing_device_rect(enclosing);
CSSPixels marker_width = enclosing.height() / 2.0f; CSSPixels marker_width = enclosing.height() / 2.0;
if (auto const* list_style_image = layout_box().list_style_image()) { if (auto const* list_style_image = layout_box().list_style_image()) {
CSSPixelRect image_rect { CSSPixelRect image_rect {

View file

@ -10,7 +10,7 @@
namespace Web { namespace Web {
PaintContext::PaintContext(Gfx::Painter& painter, Palette const& palette, float device_pixels_per_css_pixel) PaintContext::PaintContext(Gfx::Painter& painter, Palette const& palette, double device_pixels_per_css_pixel)
: m_painter(painter) : m_painter(painter)
, m_palette(palette) , m_palette(palette)
, m_device_pixels_per_css_pixel(device_pixels_per_css_pixel) , m_device_pixels_per_css_pixel(device_pixels_per_css_pixel)

View file

@ -18,7 +18,7 @@ namespace Web {
class PaintContext { class PaintContext {
public: public:
PaintContext(Gfx::Painter& painter, Palette const& palette, float device_pixels_per_css_pixel); PaintContext(Gfx::Painter& painter, Palette const& palette, double device_pixels_per_css_pixel);
Gfx::Painter& painter() const { return m_painter; } Gfx::Painter& painter() const { return m_painter; }
Palette const& palette() const { return m_palette; } Palette const& palette() const { return m_palette; }
@ -64,13 +64,13 @@ public:
return clone; return clone;
} }
float device_pixels_per_css_pixel() const { return m_device_pixels_per_css_pixel; } double device_pixels_per_css_pixel() const { return m_device_pixels_per_css_pixel; }
private: private:
Gfx::Painter& m_painter; Gfx::Painter& m_painter;
Palette m_palette; Palette m_palette;
Optional<SVGContext> m_svg_context; Optional<SVGContext> m_svg_context;
float m_device_pixels_per_css_pixel; double m_device_pixels_per_css_pixel { 0 };
DevicePixelRect m_device_viewport_rect; DevicePixelRect m_device_viewport_rect;
bool m_should_show_line_box_borders { false }; bool m_should_show_line_box_borders { false };
bool m_focus { false }; bool m_focus { false };

View file

@ -155,7 +155,7 @@ void PaintableBox::paint(PaintContext& context, PaintPhase phase) const
if (should_clip_rect) { if (should_clip_rect) {
context.painter().save(); context.painter().save();
auto border_box = absolute_border_box_rect(); auto border_box = absolute_border_box_rect();
context.painter().add_clip_rect(context.rounded_device_rect(clip_rect.to_rect().resolved(Paintable::layout_node(), border_box.to_type<float>()).to_type<CSSPixels>()).to_type<int>()); context.painter().add_clip_rect(context.rounded_device_rect(clip_rect.to_rect().resolved(Paintable::layout_node(), border_box.to_type<double>()).to_type<CSSPixels>()).to_type<int>());
} }
paint_backdrop_filter(context); paint_backdrop_filter(context);
paint_background(context); paint_background(context);
@ -434,7 +434,7 @@ static void paint_text_decoration(PaintContext& context, Gfx::Painter& painter,
CSSPixels css_line_thickness = [&] { CSSPixels css_line_thickness = [&] {
CSS::Length computed_thickness = text_node.computed_values().text_decoration_thickness().resolved(text_node, CSS::Length(1, CSS::Length::Type::Em)); CSS::Length computed_thickness = text_node.computed_values().text_decoration_thickness().resolved(text_node, CSS::Length(1, CSS::Length::Type::Em));
if (computed_thickness.is_auto()) if (computed_thickness.is_auto())
return max(glyph_height * 0.1f, 1.f); return max(glyph_height * 0.1, 1.);
return computed_thickness.to_px(text_node); return computed_thickness.to_px(text_node);
}(); }();

View file

@ -36,7 +36,7 @@ Optional<HitTestResult> SVGGeometryPaintable::hit_test(CSSPixelPoint position, H
if (auto transform = layout_box().layout_transform(); transform.has_value()) { if (auto transform = layout_box().layout_transform(); transform.has_value()) {
auto transformed_bounding_box = transform->map_to_quad( auto transformed_bounding_box = transform->map_to_quad(
const_cast<SVG::SVGGeometryElement&>(geometry_element).get_path().bounding_box()); const_cast<SVG::SVGGeometryElement&>(geometry_element).get_path().bounding_box());
if (!transformed_bounding_box.contains(position.to_type<float>())) if (!transformed_bounding_box.contains(position.to_type<double>().to_type<float>()))
return {}; return {};
} }
return result; return result;
@ -92,7 +92,7 @@ void SVGGeometryPaintable::paint(PaintContext& context, PaintPhase phase) const
auto svg_viewport = [&] { auto svg_viewport = [&] {
if (maybe_view_box.has_value()) if (maybe_view_box.has_value())
return Gfx::FloatRect { maybe_view_box->min_x, maybe_view_box->min_y, maybe_view_box->width, maybe_view_box->height }; return Gfx::FloatRect { maybe_view_box->min_x, maybe_view_box->min_y, maybe_view_box->width, maybe_view_box->height };
return Gfx::FloatRect { { 0, 0 }, svg_context.svg_element_size().to_type<float>() }; return Gfx::FloatRect { { 0, 0 }, svg_context.svg_element_size().to_type<double>().to_type<float>() };
}(); }();
SVG::SVGPaintContext paint_context { SVG::SVGPaintContext paint_context {

View file

@ -232,7 +232,7 @@ Gfx::FloatMatrix4x4 StackingContext::get_transformation_matrix(CSS::Transformati
auto count = transformation.values.size(); auto count = transformation.values.size();
auto value = [this, transformation](size_t index, Optional<CSS::Length const&> reference_length = {}) -> float { auto value = [this, transformation](size_t index, Optional<CSS::Length const&> reference_length = {}) -> float {
return transformation.values[index].visit( return transformation.values[index].visit(
[this, reference_length](CSS::LengthPercentage const& value) { [this, reference_length](CSS::LengthPercentage const& value) -> float {
if (reference_length.has_value()) { if (reference_length.has_value()) {
return value.resolved(m_box, reference_length.value()).to_px(m_box).value(); return value.resolved(m_box, reference_length.value()).to_px(m_box).value();
} }
@ -430,7 +430,7 @@ Gfx::FloatPoint StackingContext::compute_transform_origin() const
auto reference_box = paintable_box().absolute_border_box_rect(); auto reference_box = paintable_box().absolute_border_box_rect();
auto x = reference_box.left() + style_value.x.to_px(m_box, reference_box.width()); auto x = reference_box.left() + style_value.x.to_px(m_box, reference_box.width());
auto y = reference_box.top() + style_value.y.to_px(m_box, reference_box.height()); auto y = reference_box.top() + style_value.y.to_px(m_box, reference_box.height());
return { x, y }; return { static_cast<float>(x.value()), static_cast<float>(y.value()) };
} }
template<typename U, typename Callback> template<typename U, typename Callback>

View file

@ -378,7 +378,7 @@ VideoPaintable::DispatchEventOfSameName VideoPaintable::handle_mouseup(Badge<Eve
if (cached_layout_boxes.timeline_rect.has_value() && cached_layout_boxes.timeline_rect->contains(position)) { if (cached_layout_boxes.timeline_rect.has_value() && cached_layout_boxes.timeline_rect->contains(position)) {
auto x_offset = position.x() - cached_layout_boxes.timeline_rect->x(); auto x_offset = position.x() - cached_layout_boxes.timeline_rect->x();
auto x_percentage = static_cast<float>(x_offset) / static_cast<float>(cached_layout_boxes.timeline_rect->width()); auto x_percentage = static_cast<double>(x_offset) / static_cast<double>(cached_layout_boxes.timeline_rect->width());
auto position = static_cast<double>(x_percentage) * video_element.duration(); auto position = static_cast<double>(x_percentage) * video_element.duration();
video_element.set_current_time(position); video_element.set_current_time(position);

View file

@ -48,7 +48,7 @@ constexpr DevicePixels operator%(DevicePixels left, T right) { return left.value
/// CSSPixels: A position or length in CSS "reference pixels", independent of zoom or screen DPI. /// CSSPixels: A position or length in CSS "reference pixels", independent of zoom or screen DPI.
/// See https://www.w3.org/TR/css-values-3/#reference-pixel /// See https://www.w3.org/TR/css-values-3/#reference-pixel
AK_TYPEDEF_DISTINCT_NUMERIC_GENERAL(float, CSSPixels, Arithmetic, CastToUnderlying, Comparison, Increment); AK_TYPEDEF_DISTINCT_NUMERIC_GENERAL(double, CSSPixels, Arithmetic, CastToUnderlying, Comparison, Increment);
template<Arithmetic T> template<Arithmetic T>
constexpr bool operator==(CSSPixels left, T right) { return left.value() == right; } constexpr bool operator==(CSSPixels left, T right) { return left.value() == right; }

View file

@ -34,7 +34,7 @@ public:
virtual bool is_connection_open() const override { return false; } virtual bool is_connection_open() const override { return false; }
virtual Gfx::Palette palette() const override { return m_host_page.client().palette(); } virtual Gfx::Palette palette() const override { return m_host_page.client().palette(); }
virtual DevicePixelRect screen_rect() const override { return {}; } virtual DevicePixelRect screen_rect() const override { return {}; }
virtual float device_pixels_per_css_pixel() const override { return m_host_page.client().device_pixels_per_css_pixel(); } virtual double device_pixels_per_css_pixel() const override { return m_host_page.client().device_pixels_per_css_pixel(); }
virtual CSS::PreferredColorScheme preferred_color_scheme() const override { return m_host_page.client().preferred_color_scheme(); } virtual CSS::PreferredColorScheme preferred_color_scheme() const override { return m_host_page.client().preferred_color_scheme(); }
virtual void request_file(FileRequest) override { } virtual void request_file(FileRequest) override { }
virtual void paint(DevicePixelRect const&, Gfx::Bitmap&) override { } virtual void paint(DevicePixelRect const&, Gfx::Bitmap&) override { }

View file

@ -185,7 +185,7 @@ Optional<float> SVGGraphicsElement::stroke_width() const
viewport_height = svg_svg_layout_node->computed_values().height().to_px(*svg_svg_layout_node, 0); viewport_height = svg_svg_layout_node->computed_values().height().to_px(*svg_svg_layout_node, 0);
} }
} }
auto scaled_viewport_size = (viewport_width + viewport_height) * 0.5f; auto scaled_viewport_size = (viewport_width + viewport_height) * 0.5;
return width->to_px(*layout_node(), scaled_viewport_size).value(); return width->to_px(*layout_node(), scaled_viewport_size).value();
} }
return {}; return {};

View file

@ -12,10 +12,10 @@
namespace Web::SVG { namespace Web::SVG {
struct ViewBox { struct ViewBox {
float min_x { 0 }; double min_x { 0 };
float min_y { 0 }; double min_y { 0 };
float width { 0 }; double width { 0 };
float height { 0 }; double height { 0 };
}; };
Optional<ViewBox> try_parse_view_box(StringView); Optional<ViewBox> try_parse_view_box(StringView);

View file

@ -60,7 +60,7 @@ private:
virtual bool is_connection_open() const override; virtual bool is_connection_open() const override;
virtual Gfx::Palette palette() const override; virtual Gfx::Palette palette() const override;
virtual Web::DevicePixelRect screen_rect() const override { return m_screen_rect; } virtual Web::DevicePixelRect screen_rect() const override { return m_screen_rect; }
virtual float device_pixels_per_css_pixel() const override { return m_device_pixels_per_css_pixel; } virtual double device_pixels_per_css_pixel() const override { return m_device_pixels_per_css_pixel; }
virtual Web::CSS::PreferredColorScheme preferred_color_scheme() const override { return m_preferred_color_scheme; } virtual Web::CSS::PreferredColorScheme preferred_color_scheme() const override { return m_preferred_color_scheme; }
virtual void page_did_invalidate(Web::CSSPixelRect const&) override; virtual void page_did_invalidate(Web::CSSPixelRect const&) override;
virtual void page_did_change_selection() override; virtual void page_did_change_selection() override;