mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-09-04 08:36:12 +00:00
LibWeb: Support flex-basis: calc(...)
1. Propagate calc() values from StyleProperties to ComputedValues. 2. Actually resolve calc() values when determining the used flex basis. This makes the "support" section on https://shopify.com/ show up correctly as a 2x2 grid (instead of 1x4). :^)
This commit is contained in:
parent
e81d4ca1ac
commit
2e13f65ff4
Notes:
sideshowbarker
2024-07-17 02:14:39 +09:00
Author: https://github.com/awesomekling
Commit: 2e13f65ff4
Pull-request: https://github.com/SerenityOS/serenity/pull/18878
Reviewed-by: https://github.com/AtkinsSJ
4 changed files with 59 additions and 4 deletions
18
Tests/LibWeb/Layout/input/flex/calc-flex-basis.html
Normal file
18
Tests/LibWeb/Layout/input/flex/calc-flex-basis.html
Normal file
|
@ -0,0 +1,18 @@
|
|||
<!doctype html><style>
|
||||
* {
|
||||
border: 1px solid black;
|
||||
box-sizing: border-box;
|
||||
font: 20px SerenitySans;
|
||||
}
|
||||
.flex-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
background: pink;
|
||||
column-gap: 1px;
|
||||
}
|
||||
.flex-item {
|
||||
flex-basis: calc(50% - 1px);
|
||||
background: orange;
|
||||
height: 30px;
|
||||
}
|
||||
</style><div class="flex-container"><div class="flex-item">Item 1</div><div class="flex-item">Item 2</div><div class="flex-item">Item 3</div><div class="flex-item">Item 4</div></div>
|
Loading…
Add table
Add a link
Reference in a new issue