What are the limitations of using text-overflow in CSS for multi-line text truncation and how can these be overcome?
The text-overflow property in CSS is primarily designed for single-line text truncation and does not natively support multi-line text truncation. To overcome this limitation, one solution is to use a combination of CSS properties like display, overflow, and line-clamp to achieve multi-line text truncation. ```html <style> .truncate { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 3; /* number of lines to show */ } </style> <div class="truncate"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </div> ```