CSS: limit element to 1 line

user_118547 0
Viewed 64499

I want to limit a element to display only 1 line of text, with the remainder hidden (overflow:hidden), without setting a specific height. Is this possible with just CSS?

css
5 Answers

Sometimes, when you want to display elements to the left of truncated text, white-space: nowrap; does not help. Then this might be useful:

.truncated {
  max-height: 1.33em; /* Or whatever line height works for you */
  word-break: break-all;
  overflow: hidden;
}
user_646050
Related