How to reduce text content instead of squeezing the text ?

If you look at this text part, this text content get reduced when width is reduced instead of squeezing the text. How can I do that ? I'm working on a React Application.
No description
10 Replies
Bismuth
BismuthOP12mo ago
Monkeytype | A minimalistic, customizable typing test
The most customizable typing test website with a minimal design and a ton of features. Test yourself in various modes, track your progress and improve your speed.
Jochem
Jochem12mo ago
overflow: hidden; with the height set to a whole multiple of the line height if you look at the source, it's set as an inline style on the div:
<div id="wordsWrapper" translate="no" style="height: 117px; overflow: hidden;">
<div id="wordsWrapper" translate="no" style="height: 117px; overflow: hidden;">
Bismuth
BismuthOP12mo ago
but content is not hidden when you start typing making width small those content are not hidden
Jochem
Jochem12mo ago
I don't know what you mean
Bismuth
BismuthOP12mo ago
example on desktop width there is 50 words on that div but when i reduce the width there is 40 words
Jochem
Jochem12mo ago
yes, the rest is hidden by the overflow
Bismuth
BismuthOP12mo ago
okay then, I will set height and make it overflow when you type text the reamning text is popped up how can i do that ?
Jochem
Jochem12mo ago
that's probably a lot of javascript
dys 🐙
dys 🐙12mo ago
Properties you might find useful are line-clamp & text-overflow.
Want results from more Discord servers?
Add your server