Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-07 06:25:32 +01:00
Code Issues Projects Releases Packages Wiki Activity

Auto merge of #11125 - pcwalton:reddit-block-formatting-context-fix, r=mbrubeck

Browse source 
layout: Take margins in the inline direction into account when guessing the inline-size of block formatting contexts.

Fixes the layout on reddit.com.

Partially addresses #10571.

r? @mbrubeck

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="35" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/11125)
<!-- Reviewable:end -->
This commit is contained in:
bors-servo 2016-05-11 00:41:00 -07:00
commit 98863746ae
5 changed files with 100 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

12
components/layout/block.rs
View file

@ -1650,10 +1650,18 @@ impl BlockFlow {
// page set `max-width` in order to avoid hitting floats. The search box on Google
// SERPs falls into this category.)
if self.fragment.style.max_inline_size() == LengthOrPercentageOrNone::None {
let speculated_left_float_size =
max(Au(0),
self.base.speculated_float_placement_in.left -
self.fragment.margin.inline_start);
let speculated_right_float_size =
max(Au(0),
self.base.speculated_float_placement_in.right -
self.fragment.margin.inline_end);
self.fragment.border_box.size.inline =
self.fragment.border_box.size.inline -
self.base.speculated_float_placement_in.left -
self.base.speculated_float_placement_in.right;
speculated_left_float_size -
speculated_right_float_size;
}
}
FormattingContextType::None | FormattingContextType::Other => {}

22
components/layout/floats.rs
View file

@ -475,20 +475,18 @@ impl SpeculatedFloatPlacement {
let block_flow = flow.as_block();
if block_flow.formatting_context_type() != FormattingContextType::None {
*self = block_flow.base.speculated_float_placement_in;
}
if self.left > Au(0) || self.right > Au(0) {
let speculated_inline_content_edge_offsets =
block_flow.fragment.guess_inline_content_edge_offsets();
if self.left > Au(0) && speculated_inline_content_edge_offsets.start > Au(0) {
self.left = self.left + speculated_inline_content_edge_offsets.start
} else {
if self.left > Au(0) || self.right > Au(0) {
let speculated_inline_content_edge_offsets =
block_flow.fragment.guess_inline_content_edge_offsets();
if self.left > Au(0) && speculated_inline_content_edge_offsets.start > Au(0) {
self.left = self.left + speculated_inline_content_edge_offsets.start
}
if self.right > Au(0) && speculated_inline_content_edge_offsets.end > Au(0) {
self.right = self.right + speculated_inline_content_edge_offsets.end
}
}
if self.right > Au(0) && speculated_inline_content_edge_offsets.end > Au(0) {
self.right = self.right + speculated_inline_content_edge_offsets.end
}
}
if block_flow.formatting_context_type() == FormattingContextType::None {
self.left = max(self.left, block_flow.base.speculated_float_placement_in.left);
self.right = max(self.right, block_flow.base.speculated_float_placement_in.right);
}

24
tests/wpt/mozilla/meta/MANIFEST.json
View file

@ -616,6 +616,18 @@
"url": "/_mozilla/css/block_formatting_context_margin_collapse_a.html"
}
],
"css/block_formatting_context_margin_inout_a.html": [
{
"path": "css/block_formatting_context_margin_inout_a.html",
"references": [
[
"/_mozilla/css/block_formatting_context_margin_inout_ref.html",
"=="
]
],
"url": "/_mozilla/css/block_formatting_context_margin_inout_a.html"
}
],
"css/block_formatting_context_max_width_a.html": [
{
"path": "css/block_formatting_context_max_width_a.html",
@ -7410,6 +7422,18 @@
"url": "/_mozilla/css/block_formatting_context_margin_collapse_a.html"
}
],
"css/block_formatting_context_margin_inout_a.html": [
{
"path": "css/block_formatting_context_margin_inout_a.html",
"references": [
[
"/_mozilla/css/block_formatting_context_margin_inout_ref.html",
"=="
]
],
"url": "/_mozilla/css/block_formatting_context_margin_inout_a.html"
}
],
"css/block_formatting_context_max_width_a.html": [
{
"path": "css/block_formatting_context_max_width_a.html",

24
tests/wpt/mozilla/tests/css/block_formatting_context_margin_inout_a.html Normal file
View file

@ -0,0 +1,24 @@
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="match" href="block_formatting_context_margin_inout_ref.html">
<style>
html, body {
margin: 0;
}
div {
float: right;
width: 300px;
height: 32px;
background: green;
}
section {
margin-right: 300px;
overflow: hidden;
height: 64px;
background: blue;
}
</style>
<div></div>
<section></section>
<section></section>

32
tests/wpt/mozilla/tests/css/block_formatting_context_margin_inout_ref.html Normal file
View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<meta charset="utf-8">
<style>
html, body {
margin: 0;
}
div, section {
position: absolute;
}
div {
width: 300px;
height: 32px;
right: 0;
background: green;
}
section {
left: 0;
right: 300px;
height: 64px;
background: blue;
}
#a {
top: 0;
}
#b {
top: 64px;
}
</style>
<div></div>
<section id=a></section>
<section id=b></section>