how to display laravel collection entries next to each other-CodePudding

im trying to make my collection in laravel to display as so

   1       2

   3       4

With each one showing a unique entry.

However the entries displayed show a unique entry on every row rather than the way i intended it to do so and displays like so:

  1         1

  2         2

this is my code:

@forelse ($properties as $property)
                    <div class="mt-4 lg:gap-6 lg:flex lg:items-center lg:flex-wrap lg:mt-20">
                        <div class="p-4 bg-white rounded-lg">
                                    <div class="p-6">
                                        <h4 class="text-2xl font-bold cursor-pointer">
                                            {{$property->address1}}
                                            @if(!$property->address2==null)
                                            ,<br/>{{$property->address2}}
                                            @endif
                                        </h4>
                                        <div class="mt-2">
                                            <span class="text-xl font-extrabold text-blue-600">@money($property->valuation, 'ZAR')</span> /M
                                        </div>
                                        <div class="flex mt-2">
                                            Tenant<br>
                                            {{$property->user->name}}
                                        </div>
                                    </div>
                                    <div class="flex justify-between p-4 text-gray-700 border-t border-gray-300">
                                        <div class="flex items-center">
                                        </div>
                                    </div>
                        </div>
                        <div class="p-4 bg-white rounded-lg">
                                    <div class="p-6">
                                        <h4 class="text-2xl font-bold cursor-pointer">
                                            {{$property->address1}}
                                            @if(!$property->address2==null)
                                            ,<br/>{{$property->address2}}
                                            @endif
                                        </h4>
                                        <div class="mt-2">
                                            <span class="text-xl font-extrabold text-blue-600">@money($property->valuation, 'ZAR')</span> /M
                                        </div>
                                        <div class="flex mt-2">
                                            Tenant<br>
                                            {{$property->user->name}}
                                        </div>
                                    </div>
                                    <div class="flex justify-between p-4 text-gray-700 border-t border-gray-300">
                                    </div>
                        </div>
                    </div>
                @empty
                    No Properties to show
                @endforelse

Any help will be highly appreciated!

CodePudding user response：

Here is a code snippet and it will output 1 2 3 4 right. Please consider your HTML part based on this.

Controller:

$properties = collect([1,2,3,4]);

Blade:

<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/css/bootstrap.min.css" rel="stylesheet">
@forelse ($properties as $index=>$property)
    @if ($index % 2 == 0)
    <div class="row">
        <div class="col">
            {{$property}}
        </div>
    @else
        <div class="col">
            {{$property}}
        </div>
    </div>
    @endif
@empty
    No Properties to show
@endforelse