mirror of
https://github.com/RGBCube/serenity
synced 2025-10-31 09:42:45 +00:00
c710575f88
Although the spec doesn't mention it, if a flex item has box-sizing: border-box, and the specified size suggestion is a definite size, we have to subtract the borders and padding from the size before using it. This fixes an issue seen in "This Week in Ladybird #4" where the screenshots ended up in one long vertical stack instead of paired up 2 by 2.
21 lines
No EOL
454 B
HTML
21 lines
No EOL
454 B
HTML
<!doctype html><style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
font: 16px SerenitySans;
|
|
}
|
|
body {
|
|
width: 800px;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
img {
|
|
width: 50%;
|
|
height: 100px;
|
|
background: pink;
|
|
}
|
|
.padded {
|
|
padding-left: 200px;
|
|
}
|
|
</style><body><img><img class="padded" alt="hello this text is here to make the img have a wide intrinsic size" /> |