0

I am trying to use flexbox to order items at the beginning of the row. The item in the second row should not be displayed in the center. It should be like in the first row and start the beginning at the row. It should be not important if there are one or two items. enter image description here

<div class="row d-flex justify-content-start">
                    @foreach ($objekte as $objekt)
                    <div class="col d-flex justify-content-center">
                            <a href="{{ route('objekt.show', $objekt->id) }}">
                                <div class="card card-clickable" style="width: 18rem;">
                                    <img class="card-img-top" src="" alt="Card image cap">
                                    <div class="card-body">
                                        <h5 class="card-title">{{ $objekt->name }}</h5>
                                        <p class="card-text">{{ $objekt->strasse }} {{ $objekt->hausnummer }} <br> {{ $objekt->plz }} {{ $objekt->ort }}</p>
                                    </div>
                                </div>
                            </a>
                        </div>
                        @endforeach
                    </div>
aceraven777
  • 4,358
  • 3
  • 31
  • 55
JrWebDev
  • 128
  • 9

1 Answers1

-2

The justify-content property for flexbox containers controls this. I would use start instead of center to achieve the desired effect.

David Sainez
  • 6,446
  • 1
  • 22
  • 45