Issue with text overflow ellipsis

HTML-CSS
1

Why I dont see elllipsis and why is padding not applied to bottom of card?

.box {
  background-color: white;
  width: 1fr;
  box-shadow: 2px 4px 4px hsl(0deg 0% 0% / 0.38);
  border-radius: 8px;
  padding: 20px;
  overflow:hidden;
  text-overflow:ellipsis;
}
1 Like
2

The text-overflow property requires the white-space property set to nowrap
text-overflow - CSS: Cascading Style Sheets | MDN (mozilla.org)
the three properties text-overflow white-space and overflow should be applied to the element that holds the text not its container
In your case, they should be applied to the p elements

3

when i do that - when I apply them all to p - what happens is - I have only first line of sentence showing. so it doesnt match whole visible div box but cuts immediately after first line of sentence , which is, of course, undesirable for me.

4

bump
since this isn’t solved.

5