Sometimes, we want to set a max character length in CSS.
In this article, we’ll look at how to set a max character length in CSS.
How to set a max character length in CSS?
To set a max character length in CSS, we set the max-width and overflow properties.
For instance, we write
p {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 200px;
}
to set the max-width of the p element.
We hide the overflowing content with overflow: hidden;
And we add an ellipsis after the truncated content with text-overflow: ellipsis;.
We use white-space: nowrap; to keep the content in 1 row.
Conclusion
To set a max character length in CSS, we set the max-width and overflow properties.
