плавать влево плавающие элементы с шагом вниз вправо

Question

Я пытаюсь создать эскизы изображений в div, чтобы они отображались с тремя столбцами. Эти элементы находятся в теге формы. когда я пытаюсь переместить свои изображения, созданные с помощью al oop, они создают шаг вниз вправо. Я пробовал использовать сетку css, он по-прежнему дает тот же результат.

образец изображения

изображение

файл лезвия

<form action="/p/update/{{ $post->id}}" enctype="multipart/form-data" method="POST">
    <div class="form-group ">
        @foreach($posts as $post)
        <div id="carouselExampleControls" class="carousel slide" data-interval="false">
            <div class="carousel-inner">
                @for($i=0; $i< count($image=$post->images()->get()); $i++)
                    @if($i==0)
                    <div class=" ">
                        <div class="editImages ">
                            <div class="img-order"> <img class="posts-img crop" src="/images/{{$image[$i]['image']}}" alt="first slide"> </div>
                            <div class="bottom-right"><a href="{{ route('more.images', ['id' => $post->id]) }}"> more images </a></div>
                        </div>
                    </div>
                    @else
                    <div class="">
                        <div class="editImages">
                            <div class="img-order"> <img class="posts-img crop" src="/images/{{$image[$i]['image']}}" alt="first slide"> </div>
                            <div class="bottom-right"><a href="{{ route('more.images', ['id' => $post->id]) }}"> more images </a></div>
                        </div>
                    </div>
                    @endif
                    @endfor
            </div>
        </div>
        @endforeach
    </div>
</form>

css файл

.form-group{
    background:brown;
  
}
.editImages{
    display:flex;
    float: left;
    border: 1px solid black;  

}



.editImages > div > img {
   
    width: 7rem;
    height: 7rem;
}

Answer 1

idk, если я правильно понял вопрос, но попробуйте добавить это

.editImages{
  vertical-align: top;
}