forked from mirrors/gecko-dev
a08edbdf3c
Automatic update from web-platform-tests [line-clamp] Make `line-clamp` create a new BFC Although `-webkit-line-clamp` has always created an independent formatting context, our prototype implementation of `line-clamp` initially made it so the `line-clamp` property (but not `-webkit-line-clamp`) didn't necessarily create one. However, in the course of implementing this proposal, the fact that it did not necessarily create a new BFC raised issues, such as how nested line-clamps should work, or how floats inside a line-clamp container should affect floats outside it. These problems go away by having line-clamp create a new BFC, and this CL takes that route. This patch also removes `BlockLineClampData::is_original_line_clamp_context`, which was needed to be able to distinguish whether `(-webkit-)line-clamp` was specified on the current block element, or whether it inherited its line clamp data from its parent. With this change, checking if the current block is a new BFC is enough. Bug: 40336192 Change-Id: I8a16ec18ce1653caaf1c7d06280a2a7e4604a946 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5453431 Commit-Queue: Andreu Botella <abotella@igalia.com> Reviewed-by: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#1287280} -- wpt-commits: 85681c669ff292c3c55bd088bf13fd0cc038d7bd wpt-pr: 45709
37 lines
706 B
HTML
37 lines
706 B
HTML
<!DOCTYPE html>
|
|
<meta charset="utf-8">
|
|
<title>CSS Reference</title>
|
|
<style>
|
|
#scrollContainer {
|
|
overflow: scroll;
|
|
font: 16px / 32px serif;
|
|
height: 4lh;
|
|
border: 1px solid black;
|
|
}
|
|
.clamp {
|
|
display: flow-root;
|
|
padding: 0 4px;
|
|
white-space: pre;
|
|
background-color: yellow;
|
|
}
|
|
.float {
|
|
float: left;
|
|
width: 50px;
|
|
height: 50px;
|
|
margin: 4px;
|
|
background-color: skyblue;
|
|
}
|
|
</style>
|
|
|
|
<div id="scrollContainer">
|
|
<div class="clamp">Line 1
|
|
Line 2
|
|
Line 3
|
|
Line 4…<div class="float"></div></div>
|
|
|
|
<script>
|
|
window.addEventListener("load", () => {
|
|
const scrollContainer = document.getElementById("scrollContainer");
|
|
scrollContainer.scrollTop = scrollContainer.scrollHeight;
|
|
});
|
|
</script>
|