본문의 배경 이미지가 뷰포트에 반복되지 않음

Question

내 웹 사이트의 배경이 두 이미지로 구성되어 있습니다.

html{ 
height:100%; 
margin:0; 
padding:0; 
background-image:url('../images/backgroundbottom.png'); 
background-repeat:repeat-x; 
background-position:bottom; 
} 
body{ 
height:100%; 
margin:0; 
padding:0; 
font-family: "arial", "times", "courier"; 
font-size: 10pt; 
color:white; 
background-image:url('../images/backgroundtop.png'); 
background-repeat:repeat-x; 
} 

본문 배경은 html처럼 내 웹 사이트의 동적 환경에 적응하지 않습니다. 본문 배경은 오른쪽에서 반복을 멈추지 만 html은 전체 시점으로 확장됩니다. Chrome, FireFox, Android 및 Safari에서이 기능을 테스트했습니다.

html 및 body 요소가 뷰포트를 채우지 않습니다. 이 문제는 오른쪽에 position:absolute으로 푸시하는 div이 원인 일 가능성이 큽니다.

어떻게이 문제를 해결할 수 있습니까?

Answer 1

배경 첨부 추가 시도 : 고정;

background-repeat:x; 
background-attachment:fixed; 
background-position:bottom;