фон и положение divs при прокрутке вниз

У меня возникают проблемы при прокрутке вниз по моему отзывчивому дизайну. Чтобы воспроизвести «ошибку», после того, как вы находитесь в the page, увеличьте размер окна до тех пор, пока не появится вертикальная полоса прокрутки. Затем прокрутите вниз, и вы увидите, что на нем нет цвета. Кроме того, если вы продолжаете уменьшать высоту браузера, главный контейнер (wrapper) начинает выходить из страницы, и просмотреть пропущенную часть невозможно. Кто-нибудь имеет представление о том, что происходит?фон и положение divs при прокрутке вниз

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

Заранее благодарен.

UPDATE:

Я нашел простой способ избежать DIV, чтобы отрезать сверху, объявив:

@media screen and (max-height : 500px) and (min-width : 801px) { 

    body { 
     background: linear-gradient(white 0px, white 144px, #131313 144px, #131313 100%); 
    } 

    #wrapper { 
     top: 0%; 
     margin-top: 0%; 
    } 
}

Я установил top и margin-top до 0 и используется точек для рисования белая (верхняя) часть в linear gradient вместо процентов.

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

источник

2014-08-29 Philip

не дают нам jsfiddle для него так мы можем правильно видеть ваш код. – VikingBlooded

Это потому, что у вас есть высота: 480px; 'для' .wrapper'. Пожалуйста, удалите это, и вы больше не получите это пространство. Это 'style.css' line no 58 – Lal

@VikingBlooded http://jsfiddle.net/x5bsz92o/ спасибо. – Philip

Во-первых, пустое пространство внизу - это потому, что у вас есть высота на обертке сменить css;

#wrapper { 
    height: auto; 
    left: 50%; 
    margin-left: -410px; 
    margin-top: -150px; 
    overflow: hidden; 
    position: absolute; 
    top: 30%; 
    width: 797px; 
}

Ваша следующая проблема заключается в том, верх отрезают, причина этого заключается в том, потому что у вас есть margin-top: -150px;

Вы должны сделать некоторые @media макс-высоту (300px) (или что-то подобное) css, чтобы затем изменить верхнюю границу поля на обертке, когда она доходит до определенной высоты, поэтому ее больше не обрезают.

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

источник

2014-08-29 15:11:17 Jay

Хорошо, 'height: auto;' работал, спасибо за это. Вещь с отключенной вершиной заключается в том, что положение «обертки» должно быть одинаковым по отношению к фону. Если я увеличиваю отрицательную маржу, чтобы обертка опустилась, тогда она не будет совмещена с двухцветным фоном. Возможно, если я также изменю процент градиента линии для распределения цветов фона, он будет соответствовать должным образом. – Philip

Да, вам придется поиграть с процентами, чтобы получить его, но при этом -150px не будет работать неудачно. – Jay

Я сделаю так. Назад к первой проблеме, установив высоту в auto вместо фиксированного числа, решила проблему безцветного фона для обычного макета, купите, что он не работает для планшета. Вы знаете, почему? Спасибо, и жаль, что я продолжаю спрашивать. – Philip

У вас есть белая часть ниже нижнего колонтитула, потому что у вас есть height: 480px; для .wrapper, которые не создадут проблему при максимальном использовании браузера. Но когда ее размер или высота окна браузера ниже 480 пикселей, вы получите белую часть ниже THW footer.So, Удали, что и вы не будете получать, что белое пространство anymore..That, удалите

`height: 480px;`

от линии нет 58 в style.css (.wrapper)

источник

2014-08-29 17:14:43 Lal

фон и положение divs при прокрутке вниз

ответ

Смежные вопросы