How to Truncate Text with CSS - Resolving Common Issues
HTML-код
- Опубликовано: 28 апр 2024
- In today's video I'll be showing you how to truncate text (single line) with CSS and going over some of the common issues you may face and how to solve them.
For your reference, check this out:
developer.mozilla.org/en-US/d...
🏫 My Udemy Courses - www.udemy.com/user/domenic-co...
🎨 Download my VS Code theme - marketplace.visualstudio.com/...
💜 Join my Discord Server - / discord
🐦 Find me on Twitter - / dcodeyt
💸 Support me on Patreon - / dcode
📰 Follow me on DEV Community - dev.to/dcodeyt
📹 Join this channel to get access to perks - / @dcode-software
If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!
#dcode #css #webdevelopment
Hi, Dom. I think you can use line-clamp to achieve this effect on multiple lines. I believe this works on both Firefox and Chrome:
.text {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2; /* number of lines to show */
line-clamp: 2; /* number of lines to show */
-webkit-box-orient: vertical;
}
So how do I see the rest of the text?