Doing vertical text overflow in CSS is incredibly difficult and many people think it is impossible, but that is not true. In this video I will show you 2 different ways to limit the number of lines of text in a box. I will also show you how to expand/collapse those lines of text using only CSS with no JavaScript.


Materials/References:

Kevin’s Video: https://youtu.be/b6iVByCOx8A
:has Selector Video: https://youtu.be/K6CWjkDgQnE
:has Selector Article: https://blog.webdevsimplified.com/2022-09/css-has-selector
CSS Max Lines Article: https://blog.webdevsimplified.com/2020-01/dynamic-expandable-content


Find Me Here:

My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon: https://www.patreon.com/WebDevSimplified
Twitter: https://twitter.com/DevSimplified
Discord: https://discord.gg/7StTjnR
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified


⏱️ Timestamps:

00:00 - Introduction
00:48 - Webkit Technique
03:35 - My Technique
07:44 - Expand/Collapse Buttons


#CSSExpandCollapse #WDS #CSS