Цвет моего тела исчезает при прокрутке

Я надеюсь, что кто-то может помочь. Я установил свое свойство высоты тела на 100%, что отлично, когда все содержимое отображается на экране за один раз. Однако, когда мне нужно прокручивать (при минимизации окна), цвет тела исчезает, оставляя только цвет, который я устанавливал для фона HTML. Кто-нибудь знает решение?Цвет моего тела исчезает при прокрутке

html { 
background-color: #07ade0;   
} 

body { 
background-color: #7968ae; 
width: 900px; 
margin-left: auto; 
margin-right: auto; 
font: 20px verdana, "sans serif", tahoma; 
}

источник

2013-02-19 KAY DEE EMM

Просьба указать некоторые разметки и css, о которых идет речь. Согласно вашим комментариям, кажется, что вы столкнулись с проблемой переполнения. Таким образом, не зная, как ваша страница выложена, на самом деле вам не поможет. Может быть, у вас есть плавающий или абсолютно позиционированный контент? –

У вас есть страница, на которой мы могли бы посмотреть? Должно быть довольно легко диагностировать оттуда. – mhps

Если ваше тело находится в height: 100%, то это будет 100% от окна, которое не является идеальным, так как фон на длинных страницах будут получать отрезаны, как вы упомянули. Снимите свойство height, и вы должны быть установлены.

Вы также можете установить height: 100% на html, body, а затем создать контейнер в пределах body. Затем переместите стили html на body, а ваши стили body на новый контейнер.

Это предпочтительнее, так как обычно не рекомендуется устанавливать ширину пикселя в элементе body.

HTML

<body> 
    <div id="container">Your well-endowed content goes here.</div> 
</body>

CSS

html, body { 
    height: 100%; 
} 
body { 
    background: #07ade0; 
} 
#container { 
    background: #7968ae; 
    width: 900px; 
    margin-left: auto; 
    margin-right: auto; 
    font: 20px verdana, "sans serif", tahoma; 
    overflow: hidden; 
}

См DEMO.

источник

2013-02-19 17:13:34 zakangelle

Когда я делаю это, цвет фона исчезает полностью, оставляя только цвет HTML. Вот мой код, если это показывает любые ошибки: html { \t background: # 07ade0; \t \t \t } тела { \t фон: # 7968ae; \t ширина: 900px; \t margin-left: auto; \t margin-right: auto; \t \t шрифт: 20px verdana, "sans serif", tahoma; } –

Вместо применения 'background' к элементу' html', я бы предложил создать контейнер внутри 'body', а затем переместить стили' html' в 'body', а ваши стили' body' - новый контейнер. Затем добавьте 'height: 100%' как для 'html', так и' body'. См. Здесь: http://jsfiddle.net/zaknotzak/TVdxK/1/ – zakangelle

Похоже, что не работает. Я теперь использую контейнер, но теперь я получаю цвет фона [html], переопределяющий цвет [body] –

Попробуйте изменить height на min-height на свой элемент кузова. Это приведет к тому, что элемент body будет на 100% меньше содержимого, чтобы заполнить все это и расти, когда содержимое больше, чем браузер.

источник

2013-02-19 17:41:32 Shauna

Это не сработало. Просто мое тело полностью исчезло. Вот моя тестовая страница: http://www.kay-dee-emm.com/Test –

Спасибо, работал для меня! –

Цвет моего тела исчезает при прокрутке

ответ

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