Цвет фона / ошибка изображения при использовании [margin: 0 auto;] на внутреннем div - PullRequest
0 голосов
/ 18 марта 2012

В моем примере (ссылка ниже) часть фона OUTER DIV волшебным образом исчезает, когда размер браузера становится меньше определенной ширины INNER DIV (960px). Горизонтальная полоса прокрутки включается, как и ожидалось, но при прокрутке вправо вы не увидите отсутствующий участок изображения. Я полагаю, что это как-то связано со свойством INNER DIV [margin: 0 auto;], потому что, когда INNER DIV извлекается из кода, фон OUTER DIV показывает, как должен (он обрезается, но полоса прокрутки отсутствует ).

У кого-нибудь есть идеи, почему это происходит ... и как это исправить?:

http://ryanderson.com/stackoverflow/background/

1 Ответ

1 голос
/ 18 марта 2012

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>CSS Background Problem</title>
<style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body>
</html>

Css:

body {
    margin: 0 auto;
}
#outer {
    background: url("background-picture.jpg") no-repeat scroll center top transparent;
    height: 500px;
}
#inner {
    background: url("diagonal-lines.png") repeat scroll 0 0 transparent;
    height: 500px;
    margin: 0 auto;
    width: 960px;
}
...