mirror of
https://github.com/servo/servo.git
synced 2025-08-06 06:00:15 +01:00
Merge pull request #3217 from glennw/layout-fixes
Fix inline size bubbling with fixed width block. Improve intrinsic inline size calculation for text fragments.
This commit is contained in:
commit
64a9075535
9 changed files with 180 additions and 11 deletions
|
@ -1450,6 +1450,14 @@ impl Flow for BlockFlow {
|
|||
flags.set_has_left_floated_descendants(false);
|
||||
flags.set_has_right_floated_descendants(false);
|
||||
|
||||
// If this block has a fixed width, just use that for the minimum
|
||||
// and preferred width, rather than bubbling up children inline
|
||||
// width.
|
||||
let fixed_width = match self.fragment.style().get_box().width {
|
||||
LPA_Length(_) => true,
|
||||
_ => false,
|
||||
};
|
||||
|
||||
// Find the maximum inline-size from children.
|
||||
let mut intrinsic_inline_sizes = IntrinsicISizes::new();
|
||||
for child_ctx in self.base.child_iter() {
|
||||
|
@ -1458,12 +1466,15 @@ impl Flow for BlockFlow {
|
|||
child_ctx.is_table_kind());
|
||||
|
||||
let child_base = flow::mut_base(child_ctx);
|
||||
|
||||
if !fixed_width {
|
||||
intrinsic_inline_sizes.minimum_inline_size =
|
||||
geometry::max(intrinsic_inline_sizes.minimum_inline_size,
|
||||
child_base.intrinsic_inline_sizes.total_minimum_inline_size());
|
||||
intrinsic_inline_sizes.preferred_inline_size =
|
||||
geometry::max(intrinsic_inline_sizes.preferred_inline_size,
|
||||
child_base.intrinsic_inline_sizes.total_preferred_inline_size());
|
||||
}
|
||||
|
||||
flags.union_floated_descendants_flags(child_base.flags);
|
||||
}
|
||||
|
|
|
@ -1105,11 +1105,9 @@ impl Fragment {
|
|||
let range = &text_fragment_info.range;
|
||||
let min_line_inline_size = text_fragment_info.run.min_width_for_range(range);
|
||||
|
||||
let mut max_line_inline_size = Au::new(0);
|
||||
for line_range in text_fragment_info.run.iter_natural_lines_for_range(range) {
|
||||
let line_metrics = text_fragment_info.run.metrics_for_range(&line_range);
|
||||
max_line_inline_size = Au::max(max_line_inline_size, line_metrics.advance_width);
|
||||
}
|
||||
// See http://dev.w3.org/csswg/css-sizing/#max-content-inline-size.
|
||||
// TODO: Account for soft wrap opportunities.
|
||||
let max_line_inline_size = text_fragment_info.run.metrics_for_range(range).advance_width;
|
||||
|
||||
result.minimum_inline_size = geometry::max(result.minimum_inline_size, min_line_inline_size);
|
||||
result.preferred_inline_size = geometry::max(result.preferred_inline_size, max_line_inline_size);
|
||||
|
|
|
@ -107,3 +107,6 @@ flaky_gpu,flaky_linux == acid2_noscroll.html acid2_ref_broken.html
|
|||
|
||||
!= inline_background_a.html inline_background_ref.html
|
||||
== inline_element_border_a.html inline_element_border_ref.html
|
||||
== float_intrinsic_width_a.html float_intrinsic_width_ref.html
|
||||
== float_right_intrinsic_width_a.html float_right_intrinsic_width_ref.html
|
||||
== fixed_width_overrides_child_intrinsic_width_a.html fixed_width_overrides_child_intrinsic_width_ref.html
|
||||
|
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
@font-face {
|
||||
font-family: 'ahem';
|
||||
src: url('fonts/ahem/ahem.ttf');
|
||||
}
|
||||
body {
|
||||
font-family: 'ahem';
|
||||
font-size: 100px;
|
||||
margin: 0;
|
||||
line-height: 1;
|
||||
}
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
.green {
|
||||
color: green;
|
||||
}
|
||||
.fixed {
|
||||
width: 100px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="fr">
|
||||
<div class="fixed">
|
||||
<span class="green">X X</span>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
.green {
|
||||
background-color: green;
|
||||
}
|
||||
.fixed {
|
||||
width: 100px;
|
||||
height: 200px;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="fr green fixed"></div>
|
||||
</body>
|
||||
</html>
|
26
src/test/ref/float_intrinsic_width_a.html
Normal file
26
src/test/ref/float_intrinsic_width_a.html
Normal file
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
@font-face {
|
||||
font-family: 'ahem';
|
||||
src: url('fonts/ahem/ahem.ttf');
|
||||
}
|
||||
body {
|
||||
font-family: 'ahem';
|
||||
font-size: 100px;
|
||||
margin: 0;
|
||||
line-height: 1;
|
||||
}
|
||||
.fl {
|
||||
float: left;
|
||||
}
|
||||
.green {
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="fl green">X X</div>
|
||||
</body>
|
||||
</html>
|
25
src/test/ref/float_intrinsic_width_ref.html
Normal file
25
src/test/ref/float_intrinsic_width_ref.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
.fl {
|
||||
float: left;
|
||||
}
|
||||
.green {
|
||||
background-color: green;
|
||||
}
|
||||
.fixed {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="fl green fixed"></div>
|
||||
<div class="fl fixed"></div>
|
||||
<div class="fl green fixed"></div>
|
||||
</body>
|
||||
</html>
|
25
src/test/ref/float_right_intrinsic_width_a.html
Normal file
25
src/test/ref/float_right_intrinsic_width_a.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
@font-face {
|
||||
font-family: 'ahem';
|
||||
src: url(fonts/ahem/ahem.ttf);
|
||||
}
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
.green {
|
||||
color: green;
|
||||
}
|
||||
body {
|
||||
font-family: 'ahem';
|
||||
font-size: 100px;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="fr green">X X</div>
|
||||
</body>
|
||||
</html>
|
25
src/test/ref/float_right_intrinsic_width_ref.html
Normal file
25
src/test/ref/float_right_intrinsic_width_ref.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
.green {
|
||||
background-color: green;
|
||||
}
|
||||
.fixed {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="fr green fixed"></div>
|
||||
<div class="fr fixed"></div>
|
||||
<div class="fr green fixed"></div>
|
||||
</body>
|
||||
</html>
|
Loading…
Add table
Add a link
Reference in a new issue