mirror of
https://github.com/servo/servo.git
synced 2025-08-06 22:15:33 +01:00
Anonymous boxes that wrap inlines should not inherit overflow (#30579)
In legacy layout, anonymous text wrappers were inheriting the `overflow` and `text-overflow` properties. This results in the creation of extra clipping for these anonymous wrappers which could clip away floats. We will likely implement `text-overflow` differently in non-legacy layout. This change marks all legacy layout pseudo elements as "legacy" and also adds a new pseudo element for non-legacy layout that does not inherit `overflow`. Fixes #30562. Co-authored-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
parent
634a5d9cf5
commit
fd31da9102
11 changed files with 120 additions and 88 deletions
|
@ -61432,6 +61432,19 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"float-in-inline-anonymous-block-with-overflow-hidden.html": [
|
||||
"948394e7f9b348c72a13cc64f4852a988b2fa59c",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/reference/ref-filled-green-100px-square.xht",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"float-in-nested-multicol-001.html": [
|
||||
"8e1a257e389d0fdc6a4a69f63b81f32378a7b944",
|
||||
[
|
||||
|
|
|
@ -1,2 +0,0 @@
|
|||
[text-overflow-on-flexbox-001.html]
|
||||
expected: FAIL
|
|
@ -0,0 +1,2 @@
|
|||
[position-sticky-hyperlink.html]
|
||||
expected: FAIL
|
|
@ -1,2 +0,0 @@
|
|||
[filtered-inline-is-container.html]
|
||||
expected: FAIL
|
|
@ -0,0 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS Test: A float wrapped in an anonymous block should be visible within a container with overflow: hidden.</title>
|
||||
<link rel="author" href="mailto:obrufrau@igalia.com" title="Oriol Brufrau">
|
||||
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
|
||||
<link rel="help" href="https://www.w3.org/TR/CSS22/visuren.html#anonymous-block-level" />
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
<div style="overflow: hidden; width: 100px; height: 100px; background: red">
|
||||
<div style="height: 50px; background: green"></div>
|
||||
<span>
|
||||
<div style="float: left; width: 100px; height: 50px; background: green"></div>
|
||||
</span>
|
||||
</div>
|
Loading…
Add table
Add a link
Reference in a new issue