layout: Translate floats flowing out of blocks to compensate for inline

direction margins.

Improves Reddit /r/rust.
This commit is contained in:
Patrick Walton 2016-04-14 17:41:58 -07:00
parent 97de2c2afa
commit 6b6587a73b
4 changed files with 80 additions and 1 deletions

View file

@ -1608,6 +1608,18 @@
"url": "/_mozilla/css/floated_table_with_margin_a.html"
}
],
"css/floats_inline_margins_a.html": [
{
"path": "css/floats_inline_margins_a.html",
"references": [
[
"/_mozilla/css/floats_inline_margins_ref.html",
"=="
]
],
"url": "/_mozilla/css/floats_inline_margins_a.html"
}
],
"css/floats_margin_collapse_a.html": [
{
"path": "css/floats_margin_collapse_a.html",
@ -8336,6 +8348,18 @@
"url": "/_mozilla/css/floated_table_with_margin_a.html"
}
],
"css/floats_inline_margins_a.html": [
{
"path": "css/floats_inline_margins_a.html",
"references": [
[
"/_mozilla/css/floats_inline_margins_ref.html",
"=="
]
],
"url": "/_mozilla/css/floats_inline_margins_a.html"
}
],
"css/floats_margin_collapse_a.html": [
{
"path": "css/floats_margin_collapse_a.html",

View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title></title>
<link rel="match" href="floats_inline_margins_ref.html">
<style>
html, body, p {
margin: 0;
padding: 0;
}
div {
background-color: gold;
float: left;
height: 27px;
width: 27px;
}
#first {
margin-left: 27px;
}
</style>
</head>
<body>
<div></div>
<p id=first>submitted</p>
<p>x</p>
</body>
</html>

View file

@ -0,0 +1,24 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title></title>
<style>
html, body, p {
margin: 0;
padding: 0;
}
div {
background-color: gold;
float: left;
height: 27px;
width: 27px;
border-bottom: solid white 27px;
}
</style>
</head>
<body>
<div></div>
<p id=first>submitted</p>
<p>x</p>
</body>
</html>