Laravel 5 Pagination CSS Breaking

Question

I'm using Laravel 5 and Bootstrap 3.3.4

So I have the following code in my controller:

$articles = Newsarticles::paginate(10);
return view ('news',compact('articles');

Then in my view I have:

@foreach($articles as $article)

<article>
    <h2>
        <a href="{!! action('DynamicPages@show', [$article->slug]) !!}">{!! $article->headline !!}</a>
    </h2>
    <div class="body">
        {!! substr($article->article,0,500) !!}
    </div>
</article>

@endforeach

{!! $articles->render() !!}

When I run this, the pagination links at the bottom of the page come out just fine and look as they should do. However, if I change the controller to :

$articles = Newsarticles::orderBy('artdate','DESC')->paginate(10);

my pagination links come out like this:

«
1
2
3
4
5
6
»

How can one small adjustment in the code break the css?

I guess, you allow user to input html tag inside $article->title or $article->article. Therefore, you might have a broken tag in $article->headline or $article->article. You might test it by removing those line and refresh the page. — mininoz
– mininoz, Commented Apr 12, 2015 at 19:40

danjswade · Accepted Answer · 2015-04-12 19:51:06Z

1

Hadn't escaped tags and an open HTML tag was killing off the css. Thanks to @minioz for pointing it out

answered Apr 12, 2015 at 19:51

danjswade

5872 gold badges8 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

mininoz · Accepted Answer · 2015-04-12 20:27:26Z

1

From my comment above.

The problem was the broken html tag. It is because of using substr() at this line.

{!! substr($article->article,0,500) !!}

The function will cut out part of the $article->article and left some tags open.

To solve to problem you need to remove tags before do substr()

{!! substr(strip_tags($article->article),0,500) !!}

edited Apr 12, 2015 at 20:27

answered Apr 12, 2015 at 19:56

mininoz

5,9584 gold badges27 silver badges24 bronze badges

Comments

maztch · Accepted Answer · 2015-04-12 21:24:03Z

0

With substr($article->article,0,500) you may breack html code.

You can also have a distinct number of vivible chars

p>hello</p>

12 chars

<stong>hello</strong>

21 chars.

And take care of this:

echo substring('<p>hello</p>', 5);

Writes: "

he". Breack html result.

Try with

substr(strip_tags($article->article,0,500))

to strip all html tabs before cut the string. This will not breack your current html and you will get the correct chars length.

edited Apr 12, 2015 at 21:24

answered Apr 12, 2015 at 19:50

maztch

1,69621 silver badges25 bronze badges

Comments

Alana Storm · Accepted Answer · 2015-04-12 19:50:37Z

Not enough information to answer -- but the three big possibilities are

Somehow you're rendering different HTML in each example
Other CSS you have on the page isn't bullet-proof, and it's creating different container wraps based on headline and content length
There's HTML content in $article->article, $article->slug, or $article->headline with unclosed tags that's breaking the layout (or unexpected tags/styles/classes that interfere with the page CSS)

Make a copy of the raw page source (View -> Developer -> View Source in Chrome) of the page for the different requests and then run through through a diff program (CLI diff, WinMerge, opendiff, etc.) to spot any rendering differences.

Assuming there's none, investigate each but of content area for broken tags, and then start populating your layout with different length headlines and text body area until you trigger the issue, and then fix your CSS from there.

Good luck!

Collectives™ on Stack Overflow

Laravel 5 Pagination CSS Breaking

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related