I have several cards, but each one has different texts, but I want them all to have the same amount of text, so that with the "read more" it is shown later alone, although that is another thing. simply what I want is that only a certain amount of text appears so that it can be symmetrical and all of the same size.
this is my code:
<div class="card">
<img class="card-img-top" src="{{ $message->image }}" alt="">
<div class="card-body">
<small class="text-muted">Escrito por <a href="/{{ $message->user->username }}">{{ $message->user->name }}</a></small>
<p class="card-text">
{{ $message->content }}
<a href="/messages/{{ $message->id }}">Leer más</a>
</p>
</div>
<div class="card-footer">
<small class="text-muted float-rightcuarderno de refuerzo lapiz">{{ $message->created_at }}</small>
</div>
</div>
I want them all to have the same length of text
You can use Laravel's str_limit helper which does exactly what you need:
I would like something like this:
In this case use
{{ str_limit($message->content, 50, '...') }}
so it truncates the text to only 50 characters and adds the ellipses at the end.With this function, it counts the words that you indicate and omits or cuts the text up to that limit.
Just call it like this.
The first value is your text string and the second is the limit of words to display and adds three points after your established limit.
I also recommend giving your CSS a fixed height
DIV
so that they are all the same size.You can use CSS3's text-overflow and white-space property to only display one line of your text and an ellipsis at the end if text is still missing.
If you want it to be more than one line you can consult this article .