What can you do when you have a long long text and you want to display a portion of it using only css? The answer is that you can code like this:
CSS:
1 2 3 4 5 6 7 |
p.overflow_paragraph{ display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width:100% } |
HTML:
1 |
<p class="overflow_paragraph">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the</p> |
For Example a Paragraph with a long text:
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also.
Will be transformed into:
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the
Note : You can change the width of the desired text by altering the max-width value