line-clamp-content-height-with-dynamic-change.html (719B)
1 <!DOCTYPE html> 2 <title>CSS Overflow: appending to a box with -webkit-line-clamp</title> 3 <link rel="help" href="https://drafts.csswg.org/css-overflow-3/#webkit-line-clamp"> 4 <link rel="match" href="reference/line-clamp-content-height-with-dynamic-change-ref.html"> 5 <style> 6 #container { 7 display: -webkit-box; 8 -webkit-line-clamp: 2; 9 -webkit-box-orient: vertical; 10 font-size: 20px; 11 font-family: Monospace; 12 overflow: hidden; 13 } 14 </style> 15 <body> 16 <div id="container">first line<br>second line<br>PASS if this is not visible<br></div> 17 <script> 18 document.body.offsetTop; 19 let span = document.createElement('span'); 20 span.textContent = "PASS if this is not visible"; 21 container.appendChild(span); 22 </script> 23 </body>