3

I currently have <p>{{event.desc}}</p> which gives the entire description of the event.

Some have very long description, and i only want, say, the first 50 characters.

How can this be achieved?

6

2 Answers 2

5

Try this:

.fifty-chars {
    width: 50ch;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
<p class="fifty-chars">Short event description</p>
<p class="fifty-chars">Long long long long long long long long long 
    long long long long long long long long long long long long long
    long event description</p>

1
  • I added one line of code in the CSS: text-overflow: ellipsis; which will give better optical results than a string truncated abruptly. Dec 12, 2017 at 12:04
0

in PHP

<?php
if (strlen($myString) > 20) {
echo substr($myString, 0, 20) . '...';
 } else {
echo $myString;
}
?>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.