Не могу выровнять элементы (flexbox)

Question

Ссылка на картинки Нужно позиционировать картинки как в макете: Макет + фото на всякий случай как должно быть: как должно быть и как у меня выходит: как выходит

.content {
    display: flex;
    flex-wrap: wrap;
}

.content_img {
    width: 25%;
}

    <div class="content">
        <div class="content_img" id="hide_img">
            <img src="img/content/room-1.jpg" alt="Images">
        </div>
        <div class="content_img" id="hide_img">
            <img src="img/content/room-2.jpg" alt="Images">
        </div>
        <div class="content_img" id="hide_img">
            <img src="img/content/room-3.jpg" alt="Images">
        </div>
        <div class="content_img" id="hide_img">
            <img src="img/content/room-4.jpg" alt="Images">
        </div>
        <div class="content_img" id="hide_img">
            <img src="img/content/room-5.jpg" alt="Images">
        </div>
        <div class="content_img" id="hide_img">
            <img src="img/content/room-6.jpg" alt="Images">
        </div>
        <div class="content_img" id="hide_img">
            <img src="img/content/room-7.jpg" alt="Images">
        </div>
        <div class="content_img" id="hide_img">
            <img src="img/content/room-8.jpg" alt="Images">
        </div>
        <div class="content_img" id="hide_img">
            <img src="img/content/room-9.jpg" alt="Images">
        </div>
        <div class="content_img" id="hide_img">
            <img src="img/content/room-10.jpg" alt="Images">
        </div>
    </div>

Answer 1

Такое нужно делать на гридах. Если нужно сделать на флексбокс, то единственный способ это оборачивать все в дополнительные контейнеры и выравнивать уже эти контейнеры

БЛОГ НА HUSL

Не могу выровнять элементы (flexbox)

Ответы (1 шт):