Хром Положение CSS: исправлено

Question

Я теряю волосы над этим! У меня есть полноэкранное фоновое изображение, которое отображается правильно (т.е. FIXED) в firefox, но в Chrome оно отображается только правильно, если нет полосы прокрутки ?! И чем дольше страница, тем больше фонового изображения, и на очень длинной странице фоновое изображение огромно ... Я искал эту тему и нашел абсолютно конкретные исправления, но ничего, что напрямую связано с моей ситуацией, как могу ли я заставить Chrome вести себя?

Код:

<div id="background"> 
<img src="../images/37df8ead08594126a7be43e1bdf3cd00.jpg" alt="blah" class="main-bg" /> 
</div> 

#background { 
position: fixed; 
overflow: hidden; 
left: 0px; 
top: 0px; 
z-index: -1; 
} 

.main-bg{ 
position:absolute; 
top:0; 
left:0; 
z-index:1; 
width:100%; 
} 

Любая помощь будет высоко оценена !!

Answer 1

Я не совсем уверен, если это так, но вы хотите, чтобы фоновое изображение оставалось неподвижным (пока вы прокручиваете вниз или вверх изображение появляется, чтобы «двигаться» с вашей прокруткой, никогда не растягиваться и не повторяться)?

Если это так, попробуйте background-attachment:fixed и взгляните на это link.

Если это не так, что именно вы хотите достичь с фоновым изображением?

Answer 2

это может помочь вам исправить Chrome

для например: Chrome исправление.

@media screen and (-webkit-min-device-pixel-ratio:0){ 
       .CR_page_TD p { line-height:24px}//sample class 
       .cr_Rightimgdiv {float:left}//sample class 
       background-attachment:fixed//not tested yet 

} 

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