Как решить Проблему с высотой картинок?

Question

[Alibek Kulseitov]

Недавно обращался сюда насчет этой же галереи но проблема была в другом. Теперь проблема в том что никак не могу избавиться от пустого пространства под картинками.

Вот сайт

joxi.ru/p27bWnMS0jYD8m Скрин

Answer 1

[Vlad Chepel]

.grid-item img {
    width: 100%;
    height: auto;
    vertical-align: top;
    display: block; /* нужно добавить */
}

Comments

[Alibek Kulseitov]

Воу)) Два года работы верстальщиком и таких мелочей не знаю)) Спасибо!))

Answer 2

[khipster]

Удали тег <footer> или пропиши для него стиль display: none;

Comments

[Alibek Kulseitov]

Как это должно помочь?) футер тут причем?) ну попробовал, никакого результата

[khipster]

Алибек Кулсеитов: Понял о чём ты, я то думал ты футер пустым пространством называл. У тебя картинки не правильные мелкие высотой 135 px а большие 269 px. 135+135=270 а не 269

[Alibek Kulseitov]

khipster: так, все исходники одни и теже. Я лишь прописал каждой картинке height: auto

[khipster]

Алибек Кулсеитов: х = 476*240/424 = 269.4 вся фигня в размере картинок. поизменяй размер окна браузера и увидишь что белые пустые линии то пропадают то появляются.

[khipster]

Алибек Кулсеитов: залей фон чем нибудь тёмным и забей.

Answer 3

[Deeepi]

Много лишнего. Попробуй так:

.grid-item img {
    /* width: 100%; */
    /* height: auto; */
    /* vertical-align: top; */
    display: table;
}

Comments

[Alibek Kulseitov]

joxi.ru/Dr84dX0IkY5Oxr

[Alibek Kulseitov]

исходники картинок увеличил с 420 до 720 все встало ровно. Странно)