На этой веб-странице есть три фоновых изображения (одно для заголовка, одно для всей страницы и одно для раздела ниже). Каждый из них смещен, например раздел bg на 1px в Firefox и 2px в Chrome. Может быть, мне чего-то не хватает при реализации нескольких фоновых изображений на одной странице?
Вот скриншот: http://i43.tinypic.com/igjmyv.png
Заголовок BG: 1220 х 280
Основной вес: 1220 x 390
Секция bg: 1110 x 87
Структура моей HTML-страницы:
<body>
<header>
<nav>
</nav>
</header>
<div id="container">
</div>
<div id="servicespage">
<div id="container">
</div>
</div>
</body>
Мой CSS:
body {
background-color:#E2EEF3;
background-image:url(../images/bg.png);
background-position:center;
background-repeat:repeat-y;
margin: 0px auto;
}
#container {
width:960px;
margin: 0px auto;
position:relative;
overflow:hidden;
}
header {
height:280px;
background-image:url(../images/header/bg.png);
background-repeat:no-repeat;
background-position:center;
}
#servicespage {
margin:0px auto;
padding:50px;
background-image:url(../images/page-bg.jpg);
background-position:center top;
background-repeat:no-repeat;
}
Если вам нужна дополнительная информация, пожалуйста, спрашивайте! Спасибо!