I have a string of 30 characters
I want to only display the first 10 followed by ...
so for example
thisisastringthatis30characterslong
would become
thisisastr...
Is this possible using CSS?
Cheers!
The substr() method extracts a part of a string. The substr() method begins at a specified position, and returns a specified number of characters. The substr() method does not change the original string. To extract characters from the end of the string, use a negative start position.
The best way to use is white-space: nowrap; This will align the text to one line.
It´s called ellipsis and you can use it on a block element.
However it does not work in Firefox and you cannot set the width to exactly 10 characters as you cannot specify the width in characters in css.
If you want exactly 10 characters and Firefox compatibility you will have to use javascript or a server-side solution.
There is a CSS3 based solution text-overflow:ellipsis;
claimed to be crossbrowser. But also it will show as many chars as fit, not exactly 10.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With