mirror of
https://github.com/RGBCube/serenity
synced 2025-05-31 10:58:12 +00:00
81ddad3fcf
Before, we completely ignored clearance for block-level boxes if they were floated. This was incorrect because it is valid for a block-level box to be floated and still have clearance. However, unlike clearance on normal flow boxes, clearance on floating boxes does not affect the y-position of subsequent normal flow boxes. Instead, it pushes the box's position to the very beginning of an edge. Work towards https://github.com/SerenityOS/serenity/issues/21023
27 lines
No EOL
569 B
HTML
27 lines
No EOL
569 B
HTML
<!DOCTYPE html><style>
|
|
* { outline: 1px solid black; }
|
|
body { width: 600px; }
|
|
div {
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
#top {
|
|
float: left;
|
|
background: green;
|
|
}
|
|
#left {
|
|
float: left;
|
|
background: pink;
|
|
clear: both;
|
|
}
|
|
#right {
|
|
float: left;
|
|
background: orange;
|
|
}
|
|
.normal {
|
|
width: 300px;
|
|
height: 300px;
|
|
background-color: gray;
|
|
border: 10px solid sandybrown;
|
|
}
|
|
</style><body><div class="normal"></div><div id="top">top</div><div id="left">left</div><div id="right">right</div><div class="normal"></div><div class="normal"></div> |