Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-13 17:35:36 +01:00
Code Issues Projects Releases Packages Wiki Activity

layout: Enhance the heuristic that guesses the inline size of block

Browse source 
formatting contexts.

The widths of block formatting contexts depend on the floats prior to
them. To avoid a circular dependency between width assignment and height
assignment, we must guess their widths during the assign-widths pass.
The old code simply used the size of the last float, whether
left-floated or right-floated, but this proved insufficient to handle
layouts like those seen on Reddit. The new heuristic keeps track of both
left and right floats independently and sums the width of all left and
right floats to determine the width of a block formatting context. This
is still insufficient to properly lay out Reddit, but the results are
much more acceptable.

A fully correct approach will require that blocks be laid out again if
the initial guess proved to be incorrect. A `TODO` is in the code to
handle this case.
This commit is contained in:
Patrick Walton 2014-09-23 10:24:17 -07:00
parent 9fb47b7636
commit 5b4380389e
4 changed files with 151 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

1
tests/ref/basic.list
View file

@ -146,3 +146,4 @@ flaky_gpu,flaky_linux == acid2_noscroll.html acid2_ref_broken.html
== block_formatting_context_translation_a.html block_formatting_context_translation_ref.html
== floated_table_with_margin_a.html floated_table_with_margin_ref.html
== margins_inside_floats_a.html margins_inside_floats_ref.html
== block_formatting_context_complex_a.html block_formatting_context_complex_ref.html

43
tests/ref/block_formatting_context_complex_a.html Normal file
View file

@ -0,0 +1,43 @@
<!DOCTYPE html>
<html>
<head>
<style>
.a {
height: 999999px;
color: white;
}
</style>
</head>
<body>
<div class=a style="float: right; width: 200px; background: blue;">Meow</div>
<div class=a style="float: left; width: 50px; background: orange;">Mimi</div>
<div class=a style="float: left; width: 50px; background: green;">the</div>
<div class=a style="float: left; width: 50px; background: violet;">cat</div>
<div style="overflow: hidden;">
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
</div>
</body>
</html>

43
tests/ref/block_formatting_context_complex_ref.html Normal file
View file

@ -0,0 +1,43 @@
<!DOCTYPE html>
<html>
<head>
<style>
.a {
height: 999999px;
color: white;
}
</style>
</head>
<body>
<div class=a style="float: right; width: 200px; background: blue;">Meow</div>
<div class=a style="float: left; width: 50px; background: orange;">Mimi</div>
<div class=a style="float: left; width: 50px; background: green;">the</div>
<div class=a style="float: left; width: 50px; background: violet;">cat</div>
<div>
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
There once was an engine named Servo
</div>
</body>
</html>