how to use foreach loop with css

Question

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:

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