Single line ellipsis
Here is the code we use
<div> Hello world once again! </div>
1 You first need to set:
overflow: hidden; text-overflow: ellipsis;
Not enough, as you can see
Hello world once again!
2 You need to set a width
width: 120px;
Hello world once again!
2 Or a max width
max-width: 120px;
Hello world once again!
Still not enough...
3 You also need...
white-space: nowrap;
Hello world once again!
Hello world once again!
4 Conclusion
overflow: hidden; text-overflow: ellipsis; max-width: 120px; white-space: nowrap;
No comments:
Post a Comment