mirror of
https://github.com/RGBCube/serenity
synced 2025-05-20 14:45:07 +00:00

The tests still pass, but opening the files in Ladybird and Safari or Firefox shows clearly where the layouting in Ladybird is incorrect for some absolute positioned elements. The previous 1px border was subtly hiding some issues.
48 lines
802 B
HTML
48 lines
802 B
HTML
<style>
|
|
#container {
|
|
position: absolute;
|
|
width: 500px;
|
|
height: 400px;
|
|
border: 20px solid black;
|
|
}
|
|
#red {
|
|
position: absolute;
|
|
left: 20px;
|
|
top: 20px;
|
|
background: red;
|
|
width: 100px;
|
|
height: 100px;
|
|
border: 10px solid gray;
|
|
}
|
|
#green {
|
|
position: absolute;
|
|
right: 20px;
|
|
top: 20px;
|
|
background: green;
|
|
width: 100px;
|
|
height: 100px;
|
|
margin: 50px;
|
|
}
|
|
#blue {
|
|
position: absolute;
|
|
left: 20px;
|
|
bottom: 20px;
|
|
background: blue;
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
#yellow {
|
|
position: absolute;
|
|
right: 20px;
|
|
bottom: 20px;
|
|
background: yellow;
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
</style>
|
|
<div id=container>
|
|
<div id=red></div>
|
|
<div id=green></div>
|
|
<div id=blue></div>
|
|
<div id=yellow></div>
|
|
</div>
|