mirror of
https://github.com/servo/servo.git
synced 2025-08-06 06:00:15 +01:00
layout: Fix intrinsic inline size calculating of inline blocks
When calculating intrinsic inline sizes of an inline block, take its nested inline parents into account.
This commit is contained in:
parent
638e1dc40b
commit
6c5dfdf19b
4 changed files with 74 additions and 24 deletions
|
@ -1547,31 +1547,29 @@ impl Fragment {
|
|||
}
|
||||
};
|
||||
|
||||
// Take borders and padding for parent inline fragments into account, if necessary.
|
||||
if self.is_primary_fragment() {
|
||||
let writing_mode = self.style.writing_mode;
|
||||
if let Some(ref context) = self.inline_context {
|
||||
for node in &context.nodes {
|
||||
let mut border_width = node.style.logical_border_width();
|
||||
let mut padding = model::padding_from_style(&*node.style, Au(0), writing_mode);
|
||||
let mut margin = model::specified_margin_from_style(&*node.style, writing_mode);
|
||||
if !node.flags.contains(FIRST_FRAGMENT_OF_ELEMENT) {
|
||||
border_width.inline_start = Au(0);
|
||||
padding.inline_start = Au(0);
|
||||
margin.inline_start = Au(0);
|
||||
}
|
||||
if !node.flags.contains(LAST_FRAGMENT_OF_ELEMENT) {
|
||||
border_width.inline_end = Au(0);
|
||||
padding.inline_end = Au(0);
|
||||
margin.inline_end = Au(0);
|
||||
}
|
||||
|
||||
result.surrounding_size =
|
||||
result.surrounding_size +
|
||||
border_width.inline_start_end() +
|
||||
padding.inline_start_end() +
|
||||
margin.inline_start_end();
|
||||
// Take borders and padding for parent inline fragments into account.
|
||||
let writing_mode = self.style.writing_mode;
|
||||
if let Some(ref context) = self.inline_context {
|
||||
for node in &context.nodes {
|
||||
let mut border_width = node.style.logical_border_width();
|
||||
let mut padding = model::padding_from_style(&*node.style, Au(0), writing_mode);
|
||||
let mut margin = model::specified_margin_from_style(&*node.style, writing_mode);
|
||||
if !node.flags.contains(FIRST_FRAGMENT_OF_ELEMENT) {
|
||||
border_width.inline_start = Au(0);
|
||||
padding.inline_start = Au(0);
|
||||
margin.inline_start = Au(0);
|
||||
}
|
||||
if !node.flags.contains(LAST_FRAGMENT_OF_ELEMENT) {
|
||||
border_width.inline_end = Au(0);
|
||||
padding.inline_end = Au(0);
|
||||
margin.inline_end = Au(0);
|
||||
}
|
||||
|
||||
result.surrounding_size =
|
||||
result.surrounding_size +
|
||||
border_width.inline_start_end() +
|
||||
padding.inline_start_end() +
|
||||
margin.inline_start_end();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -2687,6 +2687,18 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"css/inline_block_nested_margin.html": [
|
||||
[
|
||||
"/_mozilla/css/inline_block_nested_margin.html",
|
||||
[
|
||||
[
|
||||
"/_mozilla/css/inline_block_nested_margin_ref.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/inline_block_opacity_change.html": [
|
||||
[
|
||||
"/_mozilla/css/inline_block_opacity_change.html",
|
||||
|
@ -7862,6 +7874,11 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"css/inline_block_nested_margin_ref.html": [
|
||||
[
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/inline_block_opacity_change_ref.html": [
|
||||
[
|
||||
{}
|
||||
|
@ -21770,6 +21787,14 @@
|
|||
"ed6e0f503cb26c1091270ed0992a0a41553846d9",
|
||||
"support"
|
||||
],
|
||||
"css/inline_block_nested_margin.html": [
|
||||
"b4114aa6421b4c9117e60e66ccc09868e05f3239",
|
||||
"reftest"
|
||||
],
|
||||
"css/inline_block_nested_margin_ref.html": [
|
||||
"5e00c77f55a3d12e841e9c99395f4d3783664fd8",
|
||||
"support"
|
||||
],
|
||||
"css/inline_block_opacity_change.html": [
|
||||
"df6b37b744fdf79da9d33c54b8ce77abd462c53b",
|
||||
"reftest"
|
||||
|
|
15
tests/wpt/mozilla/tests/css/inline_block_nested_margin.html
Normal file
15
tests/wpt/mozilla/tests/css/inline_block_nested_margin.html
Normal file
|
@ -0,0 +1,15 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<link rel="match" href="inline_block_nested_margin_ref.html">
|
||||
<style>
|
||||
#outer {
|
||||
margin: 0 50px;
|
||||
}
|
||||
#inner {
|
||||
display: inline-block;
|
||||
width: 200px;
|
||||
height: 40px;
|
||||
background: orange;
|
||||
}
|
||||
</style>
|
||||
<span id="outer"><span id="inner"></span></span>
|
|
@ -0,0 +1,12 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
#inner {
|
||||
display: inline-block;
|
||||
width: 200px;
|
||||
height: 40px;
|
||||
background: orange;
|
||||
margin: 0 50px;
|
||||
}
|
||||
</style>
|
||||
<span id="inner"></span>
|
Loading…
Add table
Add a link
Reference in a new issue