mirror of
https://github.com/RGBCube/serenity
synced 2025-10-31 18:52:45 +00:00
47c21cc349
This isn't actually part of CSS-FLEXBOX-1, but all major engines honor these properties in flex layout, and it's widely used on the web. There's a bug open against the flexbox spec where fantasai says the algorithm will be updated in CSS-FLEXBOX-2: https://github.com/w3c/csswg-drafts/issues/2336 I've added comments to all the places where we adjust calculations for gaps with "CSS-FLEXBOX-2" so we can find them easily. When that spec becomes available, we can add proper spec links.
18 lines
No EOL
354 B
HTML
18 lines
No EOL
354 B
HTML
<style>
|
|
* {
|
|
border: 1px solid black;
|
|
font: 16px SerenitySans;
|
|
}
|
|
.flexbox {
|
|
display: flex;
|
|
column-gap: 20px;
|
|
flex-wrap: wrap;
|
|
row-gap: 40px;
|
|
width: 100px;
|
|
}
|
|
.flexbox > div {
|
|
width: 30px;
|
|
height: 30px;
|
|
}
|
|
</style>
|
|
<div class=flexbox><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div> |