mirror of
https://github.com/RGBCube/serenity
synced 2025-07-27 07:57:46 +00:00
LibWeb: Narrow width of boxes that create BFC to avoid overlap of float
https://www.w3.org/TR/CSS22/visuren.html#floats says that when a box establishes BFC it should not overlap with floats. The way to avoid overlaps is up to implementor. This change implements avoiding overlap by narrowing width of a box because it seems like what other engines do (in the scenarios I tested).
This commit is contained in:
parent
bf41af6b9d
commit
853ecb8d8e
3 changed files with 71 additions and 10 deletions
|
@ -0,0 +1,23 @@
|
|||
<style>
|
||||
* {
|
||||
font-family: 'SerenitySans';
|
||||
}
|
||||
|
||||
.float {
|
||||
width: 200px;
|
||||
height: 1000px;
|
||||
background-color: royalblue;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.bfc {
|
||||
background-color: mediumseagreen;
|
||||
border: 10px solid skyblue;
|
||||
display: flow-root;
|
||||
}
|
||||
</style>
|
||||
<div class="wrapper"><div class="float"></div><div class="bfc">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vitae
|
||||
neque nunc. Nam fermentum libero a lectus vulputate eleifend. Nam sagittis
|
||||
tristique augue, id sodales mauris suscipit at. Vivamus eget placerat ex.
|
||||
Suspendisse potenti. Morbi pulvinar ipsum eget nulla dapibus, ac varius mi
|
||||
eleifend.
|
Loading…
Add table
Add a link
Reference in a new issue