Row-Klasse in Bootstrap richtig in die foreach-Schleife einbauen

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Tabula_Rasa

Mitglied
12 Mai 2017
262
2
18
Hallo,

in der foreach-Schleife werden Datenbankeinträge aufgelistet. Dabei möchte ich, dass vier Einträge nebeneinander sind und der fünfte in der zweiten Reihe anfängt.

Code:
<h1 style="text-align:center;">Music</h1>
<br>
<div class="row">
@if (count($musics) > 0)
@foreach ($musics as $music)
    <div class="col-md-4">
      <a href="{{$music->link_path}}"><img src="{{$music->pic_path}}" style="width:200px;height:200px;" alt="time"></a>
      <br><br>
    <h3>{{$music->title}}</h3>
    <span style="color:#72a8ff;text-decoration: underline;">{{$music->tag}}</span>

    {!!Form::open(['action' => ['[email protected]', $music->id], 'method' => 'POST', 'class' => 'float-right'])!!}
       {{Form::hidden('_method', 'Delete')}}
       {{Form::submit('Delete', ['class'=>'btn btn-danger'])}}
    {!!Form::close()!!}
    <a type="button" class="btn" href="/musics/{{$music->id}}/edit" style="float:right;">Edit</a>
  </div>
</div>
@endforeach
@else
<div style="margin:0 auto;">
No music found.
</div>
@endif
Ich benutze das Framework Laravel. Ich frag mich, wie ich die Klassen "row" und "col-md-4" so einbauen kann, dass nach 4 Schleifen der fünfte Eintrag in der 2 Reihe aufgelistet wird.
Hat da jemand eine Idee?
 
Werbung:

Tronjer

Senior HTML'ler
8 Oktober 2010
5.238
483
83
Berlin
Zusätzlich über den Index iterieren. Für die Ermittlung des Restwertes gibt es Modulo.
 
Werbung:

Sentence

Aktives Mitglied
30 Juni 2011
475
46
28
Wenn du mehr als 12 Columns in einer row hast, wrapped bootstrap das doch automatisch. In deinem Fall passen also nur 3 Einträge in eine Reihe und der 4te Eintrag landet in der nächsten Reihe. Da brauchst du nicht so einen Aufwand betreiben.

MfG

//EDIT
für 4 Einträge pro Reihe musst du aus
col-md-4
dann col-md-3 machen
 
Werbung:
Werbung: