CODEWITHSUNDEEP
csslaravelloopsforeach
Alya Al Siyabi
Alya Al Siyabi

Reputation: 56

how to use foreach loop with css

hi I am trying to get data from the database by the use of foreach loop in Laravel, I want to organize them horizontally.I mean the fist group of data beside second group of data. The problem is that when I use cards or slider it reapted data vertically. as it is shown in the pictures. So any one can help me to bring data from db and orgnize them horizontally? ! just the idea

it looks like that when I used foreach loop: it looks like that when I used foreach loop

I want to show it like that horizontally: I want to show it like that horizontally

This is the code that I used in the blade

                   @endforeach
                        @elseif (count($data ) >2)
                         
     <div class="row">
      <div class="col-sm-3">
      @foreach ($data as $key => $jobs)
        <div class="card">
          <div class="card-body">
            <h5 class="card-title">{{$jobs->tilte}}</h5>
            <p class="card-text">{{$jobs->final_sub}}</p>
            <a href="#" class="btn btn-primary">Apply</a>
          </div>
        </div>
       
      @endforeach
      </div>
      </div>        
     
    @else

Upvotes: 1

Views: 784

Answers (1)

Kaleem Shoukat
Kaleem Shoukat

Reputation: 859

Just change the placement of loop. You can do it as following:

<div class="row">
  @foreach ($data as $key => $jobs)
  <div class="col-sm-3">
    <div class="card">
      <div class="card-body">
        <h5 class="card-title">{{$jobs->tilte}}</h5>
        <p class="card-text">{{$jobs->final_sub}}</p>
        <a href="#" class="btn btn-primary">Apply</a>
      </div>
    </div>
   </div>   
  @endforeach
</div>

Upvotes: 1

Related Questions