Text overflow ellipsis once it invades parent padding
Hello, I have a container with wrapping flex items. The items are rectangles that have an icon and some text and have a set padding. However, in some of there is too much text once they reach their minimum width and I want the text to overflow with ellipsis when it happens.
I tried setting
text-overflow: ellipsis; overflow: hidden
text-overflow: ellipsis; overflow: hidden
on the
<p>
<p>
tag with text and text disappears where I want it to however no ellipsis appear.
Ideally I would want it to show as many lines as possible and ellipsis if the lines overflow into parent's padding
I provided a screenshot that hopefully shows what I mean, there's more text there and it clips on parent's padding but doesn't show ellipsis.