Как убрать отступ у блоков между картинками?

Question

[SLFCM308]

Пробывал overflow:hidden; font-size:0; Но реакции 0, либо я сошёл с ума и вставлял не в тот класс.
Фото вопроса: https://drive.google.com/open?id=17IbNe1PwPDF9U-vF...

<div class="photo">
        <div class="photo_column">
            <div class="photo_item">
                <img src="assets/images/g8.ycDsj.jpg">
            </div>
            <div class="photo_item">
                <img src="assets/images/16800.Ks5FY.jpg">
            </div>
        </div>
        <div class="photo_column">
            <div class="photo_item">
                <img src="assets/images/doublegr.ywuEr.jpg">
            </div>
            <div class="photo_item">
                <img src="assets/images/otzh.5c9Wx.jpg">
            </div>
        </div>
        <div class="photo_column">
            <div class="photo_item1">
                <img src="assets/images/heart.1Jzuz.jpg">
            </div>
        </div>
        <div class="photo_column">
            <div class="photo_item">
                <img src="assets/images/screenshot_302.t5eZm.png">
            </div>
            <div class="photo_item">
                <img src="assets/images/axun-30.8I11w.jpg">
            </div>
        </div>
    </div>

.photo {
    display: flex;
}

.photo_column {
    justify-content: space-between;
}

img {
    max-width: 100%;
}

Answer 1

[Ankhena]

display:block картинкам

Comments

[SLFCM308]

Есть варианты как вытянуть третью фотографию в колонке до низа картинок 2-го ряда?

[Ankhena]

SLFCM308, если вы сделаете песочницу на jsfiddle.net, то посмотрю что там у вас. Не качать же архивы.

[SLFCM308]

Ankhena, https://jsfiddle.net/kpzvdjtg/. Не знаю пока как туда загрузить актуальные фото, но по изображениям по-умолчанию думаю суть поймёте

[Ankhena]

SLFCM308, я вижу поле с результатом так:

Не знаю пока как туда загрузить актуальные фото

Туда - никак. Только ссылки на картинки выложенные куда-то в инет и доступные по этим ссылкам (т.е. не закрытые паролями). Можете заменить на любые другие подходящие из яндекс.картинок.

[SLFCM308]

Ankhena, да, уже догадался до вашего комментария, но с первым фото не вышло, продолжу поиск

[Ankhena]

SLFCM308, просто поставьте фото подходящих размеров из яндекс.картинок

[SLFCM308]

Ankhena, https://jsfiddle.net/kpzvdjtg/

[Ankhena]

SLFCM308, что-то я думала, что на гугло-диске архив с кодом, а там просто фотка.

Вам нужен либо grid, если фотки известны и конечны.
Либо плагин masonry.
Еще свойство object-fit.

[SLFCM308]

Ankhena, там всё ровно не имею понятия как из разделить из-за этой одной фотки, лучше архив кину

[SLFCM308]

Ankhena, можно вашу почту для персонального доступа?

[Ankhena]

SLFCM308,
https://jsfiddle.net/Ankhena/f15p6bmd/
https://jsfiddle.net/Ankhena/q2bvzfgn/
https://jsfiddle.net/Ankhena/ax23r6zf/
и т.д.

[SLFCM308]

Ankhena, Примеры интересные, но в них ещё надо разобраться, да и там теже отступы

[Ankhena]

SLFCM308, там отступы специальные, чтобы в кашу не слиплось.
Уберите grid-gap не будет отступов.

[SLFCM308]

Ankhena, понимаю, можно всё же вас как-то попросить переделать имеющийся код? думаю там вопрос 3-х минут

[Ankhena]

SLFCM308, https://jsfiddle.net/onxqr31m/

[Ankhena]

SLFCM308,
При несоответствии пропорций картинки и блока:
https://jsfiddle.net/as2p3ty6/

[SLFCM308]

Ankhena, Всё круто, просто невероятный респект вам, но оно и срабатывает и нет) Получается по вашим примерам вытянуть картинку, как надо , но тогда блок на всю ширину не вытягивается

[SLFCM308]

скину архив на почту?

[Ankhena]

SLFCM308, да не хочу я архивы в почту )))) Что за гадость )))))

Ширина блоков по 25%
https://jsfiddle.net/gz97ecn1/

У вас ширина маленьких блоков определялась размерами картинки.
Если картинки несоответствующих пропорций, то плясать придется от размеров блоков или их пропорций.
Вы можете применить object-fit только к "неправильной", а не ко всем, предварительно определившись с размером блока.

[SLFCM308]

Ankhena, Разобрался, но фишку с object-fit не врубаю, изменений с ним и без него не вижу

[Ankhena]

SLFCM308, https://jsfiddle.net/Ankhena/foqm8gbt/

[SLFCM308]

Ankhena, Гуру) напоследок, получается в моей задаче использование grid свойств разумнее и правильнее использовать? Чтобы для дальнейшего понимать, что правильнее

[Ankhena]

SLFCM308, Если разметка статична, то гридами удобно.

[SLFCM308]

Ankhena, то есть по идее нет такого термина правильнее flex или grid. Если динамично с использованием transition, то лучше flex?

[Ankhena]

SLFCM308, если разметка динамическая, то плагином masonry.

Откуда transition я не поняла. Если при наведении картинки должны увеличиваться, то без разницы флекс там или грид. Возможно, абсолют, но зависит от того, что и как именно должно увеличиваться.

И это уже совсем далеко от темы вопроса.

[SLFCM308]

Ankhena, спасибо. Да, transition я просто к примеру привёл