-webkit-line-clamp with a block after the last line doesn't work
Categories
(Core :: CSS Parsing and Computation, defect, P3)
Tracking
()
People
(Reporter: christopher, Unassigned)
References
Details
Attachments
(3 files)
User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.114 Safari/537.36
Steps to reproduce:
- Create a container with three lines of text and an UL list.
- Style the container with "-webkit-box-orient: vertical" and "-webkit-line-clamp: 3"
Code Example:
https://codesandbox.io/s/trusting-banzai-7h9pt?file=/index.html
Actual results:
The full text with the content of the ul list will be printed.
Expected results:
Only the first three lines should be printed.
Comment 1•3 years ago
|
||
Comment 2•3 years ago
|
||
This works the same way as Safari doesn't it?
It seems Chromium is recursing into nested non-anonymous blocks, which is rather odd. E.g., if I change the <ul>
by a <div>
, then Chrome agrees with us because the <div>
is a nested flex container, but if I use another block like a <section>
, then we disagree again. That's an slightly simpler test-case so will do that.
Updated•3 years ago
|
Comment 3•3 years ago
|
||
Only the first element is taken into account and the rest is totally ignored when it comes to display :block.
If elements are in display: inline or contents, no problem.
With inline-block, in this case, the property doesn't even work anymore.
Description
•