diff options
| -rw-r--r-- | components/layout/block.rs | 14 | ||||
| -rw-r--r-- | tests/ref/basic.list | 1 | ||||
| -rw-r--r-- | tests/ref/block_formatting_context_max_width_a.html | 24 | ||||
| -rw-r--r-- | tests/ref/block_formatting_context_max_width_ref.html | 27 |
4 files changed, 62 insertions, 4 deletions
diff --git a/components/layout/block.rs b/components/layout/block.rs index 420802bed43..70a3da462da 100644 --- a/components/layout/block.rs +++ b/components/layout/block.rs @@ -1639,10 +1639,16 @@ impl Flow for BlockFlow { // We can't actually compute the inline-size of this block now, because floats // might affect it. Speculate that its inline-size is equal to the inline-size // computed above minus the inline-size of the previous left and/or right floats. - self.fragment.border_box.size.inline = - self.fragment.border_box.size.inline - - self.inline_size_of_preceding_left_floats - - self.inline_size_of_preceding_right_floats; + // + // (If `max-width` is set, then don't perform this speculation. We guess that the + // 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 { + self.fragment.border_box.size.inline = + self.fragment.border_box.size.inline - + self.inline_size_of_preceding_left_floats - + self.inline_size_of_preceding_right_floats; + } } FormattingContextType::Other => { self.base.flags.remove(IMPACTED_BY_LEFT_FLOATS); diff --git a/tests/ref/basic.list b/tests/ref/basic.list index ef1858ffd86..5eba71f26b0 100644 --- a/tests/ref/basic.list +++ b/tests/ref/basic.list @@ -44,6 +44,7 @@ flaky_cpu == append_style_a.html append_style_b.html == block_formatting_context_complex_a.html block_formatting_context_complex_ref.html == block_formatting_context_containing_floats_a.html block_formatting_context_containing_floats_ref.html == block_formatting_context_float_placement_a.html block_formatting_context_float_placement_ref.html +== block_formatting_context_max_width_a.html block_formatting_context_max_width_ref.html == block_formatting_context_relative_a.html block_formatting_context_ref.html == block_formatting_context_translation_a.html block_formatting_context_translation_ref.html == block_formatting_context_with_margin_a.html block_formatting_context_with_margin_ref.html diff --git a/tests/ref/block_formatting_context_max_width_a.html b/tests/ref/block_formatting_context_max_width_a.html new file mode 100644 index 00000000000..94cdedd3782 --- /dev/null +++ b/tests/ref/block_formatting_context_max_width_a.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<style> +html, body { + margin: 0; +} +section { + width: 300px; +} +div { + height: 100px; +} +#a { + float: right; + width: 100px; + background: gold; +} +#b { + overflow: hidden; + max-width: 200px; + background: blue; +} +</style> +<section><div id=a></div><div id=b> + diff --git a/tests/ref/block_formatting_context_max_width_ref.html b/tests/ref/block_formatting_context_max_width_ref.html new file mode 100644 index 00000000000..3c40d312253 --- /dev/null +++ b/tests/ref/block_formatting_context_max_width_ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<style> +html, body { + margin: 0; +} +section { + width: 300px; +} +div { + position: absolute; + height: 100px; + top: 0; +} +#a { + float: right; + width: 100px; + left: 200px; + background: gold; +} +#b { + overflow: hidden; + width: 200px; + background: blue; +} +</style> +<section><div id=a></div><div id=b> + |