mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-05-12 18:08:15 +02:00
2614790a93
CSS2 requires moving a float downward until it fits beside existing floats. We already handled same-side blockers, but opposite-side blockers could still overlap, such as matching left and right 100% floats. Recompute same-side bookkeeping after lowering and measure opposite-side intrusion in the current containing block's coordinate space. Also account for the full inline space already occupied on the current side after same-side stacking, so a float shifted next to an earlier same-side float does not still overlap an opposite-side float. Add tests covering inline and nested lowering, stale same-side line state, staggered opposite-side stacks, and the left/right/left 600px overlap case. Update the stacked clear-both expectation to match the corrected placement.
39 lines
585 B
HTML
39 lines
585 B
HTML
<!DOCTYPE html>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
width: 800px;
|
|
}
|
|
|
|
.outer-right {
|
|
background: rgba(255, 140, 80, 0.6);
|
|
float: right;
|
|
width: 250px;
|
|
height: 100px;
|
|
}
|
|
|
|
.container {
|
|
margin-left: 300px;
|
|
outline: 1px solid #666;
|
|
width: 400px;
|
|
}
|
|
|
|
.inner-left {
|
|
background: rgba(80, 140, 255, 0.6);
|
|
float: left;
|
|
width: 250px;
|
|
height: 50px;
|
|
}
|
|
|
|
.clear {
|
|
clear: both;
|
|
height: 0;
|
|
}
|
|
</style>
|
|
<div class="outer-right"></div>
|
|
<div class="container">
|
|
<div class="inner-left"></div>
|
|
<div class="clear"></div>
|
|
</div>
|
|
<div class="clear"></div>
|