laravel foreach broke column - php

Question

Sorry for title i couldn't think better title!
anyway, this is my blog page code:
#extends('layouts.frontend_index')
#section('title', 'Blog')
#section('content')
<div class="container">
<div class="row" style="margin-bottom:30px;">
<div class="col-md-8">
<div class="row">
#forelse($posts as $post)
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12" style="margin-bottom:15px;">
<div class="card card2">
<div class="cardimg">
<img src="{{ url('images/') }}/{{ $post->image }}" class="card-img-top" style="width:100%; height:auto; max-height:500px;" alt="{{ $post->title }}">
</div>
<div class="card-block">
<h4 class="card-title">{{$post->title}}</h4>
<p class="card-text">{!! str_limit($post->body, 10) !!}</p>
<p><a class="btn btn-block btn-link" href="{{ route('frontshow', $post->slug ) }}">Read More <i class="fa fa-arrow-right"></i></a></p>
</div>
</div>
</div>
#empty
<p>No Post Available yet!</p>
<div class="text-center">
<a class="btn btn-error" href="{{url('/')}}">Back to Main Page</a>
</div>
#endforelse
<div class="col-md-12 text-center">
{{$posts->links()}}
</div>
</div><!--end row-->
</div><!--end col-md-8-->
<div class="col-md-4">
<h3>Get Latest Updates...</h3>
<a target="_blank" href="https://t.me/studiotjd"><div id="telegram"></div></a>
<a target="_blank" href="https://www.facebook.com/studiotjd"><div id="facebook"></div></a>
<a target="_blank" href="https://www.instagram.com/studiotjd/"><div id="instagram"></div></a>
</div><!--end col-md-4-->
</div><!--end row-->
<div class="row">
<div class="col-md-12">
<div class="row">
<div class="col-md-4 span3 wow rollIn" style="animation-delay: 1s;"><div id="Library"></div></div><!--end col-md-4-->
<div class="col-md-4 span3 wow bounceInDown center" style="animation-delay: 1s;"><div id="Library2"></div></div><!--end col-md-4-->
<div class="col-md-4 span3 wow bounceInRight" style="animation-delay: 1s;"><div id="Library3"></div></div><!--end col-md-4-->
</div><!--end row-->
</div><!--end col-md-12-->
</div><!--end row-->
</div>
#endsection
here is how it looks like in view:
I tried almost everything to fix this issue but nothing works!
As you can see in my inspect all col-md-4 goes under first col-md-4 and i don't know why
Is there anyone knows how to fix this issue?

Answer 1

try this
{{ strip_tags(str_limit($post->body, 10)) }}
I think you have html element stored in your database, and you are just using str_limit so the tags in your body is not closed.

Answer 2

problem is a height of div, check it on the inspector code. 1 px or more is