webkit-line-clamp-052.html (699B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Overflow: center-aligned -webkit-line-clamp ellipsis</title> 4 <link rel="help" href="https://drafts.csswg.org/css-overflow-4/#propdef--webkit-line-clamp"> 5 <link rel="match" href="reference/webkit-line-clamp-052-ref.html"> 6 <meta name="assert" content="If the -webkit-line-clamp ellipsis would be placed in an aligned line, the alignment happens after placing the ellipsis."> 7 <style> 8 .clamp { 9 display: -webkit-box; 10 -webkit-box-orient: vertical; 11 -webkit-line-clamp: 2; 12 overflow: hidden; 13 14 width: 10em; 15 border: 2px solid black; 16 text-align: center; 17 } 18 </style> 19 <div class="clamp"> 20 Line 1 <br> 21 Line 2 <br> 22 Line 3 23 </div>