Auto merge of #24736 - paulrouget:layoutissue, r=SimonSapin

layout: Ensure abs-pos elements establish block formatting contexts

Updating #16310

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `___` with appropriate data: -->
- [x] `./mach build -d` does not report any errors
- [x] `./mach test-tidy` does not report any errors
- [x] These changes fix #13495 (GitHub issue number if applicable)

<!-- Either: -->
- [x] There are tests for these changes OR
- [ ] These changes do not require tests because ___

<!-- Also, please make sure that "Allow edits from maintainers" checkbox is checked, so that we can help you if you get stuck somewhere along the way.-->

<!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. -->
This commit is contained in:
bors-servo 2019-11-16 20:20:15 -05:00 committed by GitHub
commit 2c09f94358
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 71 additions and 0 deletions

View file

@ -1682,6 +1682,13 @@ impl BlockFlow {
/// Determines the type of formatting context this is. See the definition of
/// `FormattingContextType`.
pub fn formatting_context_type(&self) -> FormattingContextType {
if self
.base
.flags
.contains(FlowFlags::IS_ABSOLUTELY_POSITIONED)
{
return FormattingContextType::Other;
}
if self.is_inline_flex_item() || self.is_block_flex_item() {
return FormattingContextType::Other;
}

View file

@ -43,6 +43,18 @@
{}
]
],
"css/absolute_block_format_ctx.html": [
[
"css/absolute_block_format_ctx.html",
[
[
"/_mozilla/css/absolute_block_format_ctx_ref.html",
"=="
]
],
{}
]
],
"css/absolute_clipping_of_own_contents.html": [
[
"css/absolute_clipping_of_own_contents.html",
@ -7692,6 +7704,9 @@
"css/abs_rel_explicit_height_ref.html": [
[]
],
"css/absolute_block_format_ctx_ref.html": [
[]
],
"css/absolute_clipping_of_own_contents_ref.html": [
[]
],
@ -13461,6 +13476,14 @@
"4e9833c29529e58690f5f26e546e0d66a22ca369",
"support"
],
"css/absolute_block_format_ctx.html": [
"e7540c1cfe8eaab06e9c3b87214263d2c3abec34",
"reftest"
],
"css/absolute_block_format_ctx_ref.html": [
"42420061724718702f611abd2ff4c61774fc4b86",
"support"
],
"css/absolute_clipping_of_own_contents.html": [
"19919ff89c72d3425d188c49c27916a9eb885359",
"reftest"

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<link rel=match href=absolute_block_format_ctx_ref.html>
<style>
div {
display: inline;
position: absolute;
}
span {
float: left;
width: 50px;
height: 50px;
}
</style>
</head>
<body>
<div>
<span style="background:red"></span>
<span style="background:blue"></span>
</div>
</body>
</html>

View file

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<style>
div {
float: left;
width: 50px;
height: 50px;
}
</style>
</head>
<body>
<div style="background:red"></div>
<div style="background:blue"></div>
</body>
</html>