serenity/Base/res/html/misc/float-stress-3.html
Andreas Kling d43ef27761 LibWeb: Only include containing blocks in coordinate space translation
Layout box offset coordinates are always relative to their containing
block. Therefore, the functions that convert between coordinate spaces
should only visit containing blocks and apply their offsets, not *every*
box in the parent chain.

This fixes an issue where some floating boxes were unexpectedly far away
from their containing block.
2022-09-22 16:54:12 +02:00

53 lines
1.1 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>float horror show</title>
<style type="text/css">
html {
font: 16px/1 Arial;
}
.outer {
border: 1px solid black;
width: 300px;
height: 250px;
}
.one {
float: left;
height: 50px;
width: 200px;
margin: 0;
border: 1px solid black;
background-color: #fc0;
}
.two {
float: right;
height: 50px;
width: 200px;
margin: 0;
border: 1px solid black;
background-color: pink;
}
.lefty {
float: left;
height: 50px;
width: 50px;
margin: 0;
border: 1px solid black;
background-color: lime;
}
.righty {
float: right;
height: 30px;
width: 30px;
margin: 0;
border: 1px solid black;
background-color: magenta;
}
</style></head><body>
<div class=outer>
foo bar baz foo bar baz
<div class=lefty></div>
<div class=one></div>
<div class=two></div>