mirror of
https://github.com/SerenityOS/serenity
synced 2024-10-15 20:33:10 +00:00
LibWeb: Initial offset in reverse flex layout moved to opposite side
This change moves the initial offset for justify-content: center to the opposite side if the flex layout is in the reverse direction.
This commit is contained in:
parent
6ae208dbf6
commit
8200d1f68b
|
@ -0,0 +1,19 @@
|
|||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x66 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x50 children: not-inline
|
||||
Box <div.flex> at (8,8) content-size 784x50 flex-container(row-reverse) [FFC] children: not-inline
|
||||
BlockContainer <div> at (425,8) content-size 50x50 flex-item [BFC] children: inline
|
||||
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||
frag 0 from TextNode start: 0, length: 1, rect: [425,8 6.34375x17.46875]
|
||||
"1"
|
||||
TextNode <#text>
|
||||
BlockContainer <div> at (375,8) content-size 50x50 flex-item [BFC] children: inline
|
||||
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||
frag 0 from TextNode start: 0, length: 1, rect: [375,8 8.8125x17.46875]
|
||||
"2"
|
||||
TextNode <#text>
|
||||
BlockContainer <div> at (325,8) content-size 50x50 flex-item [BFC] children: inline
|
||||
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
||||
frag 0 from TextNode start: 0, length: 1, rect: [325,8 9.09375x17.46875]
|
||||
"3"
|
||||
TextNode <#text>
|
|
@ -0,0 +1,11 @@
|
|||
<!doctype html><style>
|
||||
.flex {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
.flex > div {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}</style><body><div class="flex"><div style="background-color: red;">1</div><div style="background-color: blue;">2</div><div style="background-color: yellow;">3</div>
|
|
@ -1268,6 +1268,9 @@ void FlexFormattingContext::distribute_any_remaining_free_space()
|
|||
break;
|
||||
case CSS::JustifyContent::Center:
|
||||
initial_offset = (inner_main_size(flex_container()) - used_main_space) / 2.0f;
|
||||
if (is_direction_reverse()) {
|
||||
initial_offset = inner_main_size(flex_container()) - initial_offset;
|
||||
}
|
||||
break;
|
||||
case CSS::JustifyContent::SpaceBetween:
|
||||
space_between_items = flex_line.remaining_free_space / (number_of_items - 1);
|
||||
|
|
Loading…
Reference in a new issue