css дополнительное место в div

Question

Мне трудно понять, как сделать так, чтобы мои фотографии показывались в нужном месте

вот скрипка , которая выглядит хуже, бюст моей страницы даст вам представление о том, что я пытаюсь сделать

вот как это выглядит на страницы и на `!

Как вы можете видеть, у div "pictures" есть пространство над изображениями внутри, и они выдвигаются внизу, что делает мой градиент неправильным.

Я не могу понять, откуда берется дополнительное пространство

дополнительный

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

Answer 1

Проблема, с которой вы столкнулись, заключается в том, что div.spacer вверху ваших фотографий DIV очищает всплывающее a.home (боковую панель, если я не ошибаюсь). Возможным решением было бы поставить overflow:hidden на фотографии DIV.

(По сути, вы можете управлять «областью» CSS clear, используя overflow для создания так называемого «контекста форматирования блока». Если вы примените overflow:hidden к изображениям DIV, то clear:both элементы внутри этого DIV не могут очистить плавающие объекты вне этого DIV.)

Answer 2

Установите top в div.pictures на 0px ;.Тем не менее, трудно сказать, хотите ли вы использовать Fiddle.

Answer 3

Трудно сказать с помощью JSFiddle, но:

div.pictures {
    position:relative;
    top:200px;
    width:90%;
    margin:auto;
    background: rgba(255,255,238, 0.25)    
}

Похоже, что top:200px; правило добавляет значительное пространство.

Answer 4

попробуйте поставить <br style="clear:both;" /> в конце div!

Answer 5

У вас есть top: 200px; в CSS ваших фотографий div