私の Web サイトには、2 つの画像で構成された背景があります。
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 のように、本文の背景が Web サイトの動的環境に適応しません。ボディの背景は右側で繰り返されなくなりますが、html はビューポイント全体に拡張されます。Chrome、FireFox、Android、および Safari でこれをテストしました。
html 要素と body 要素はビューポートを埋めません。div
この問題は、 が で右側に押し出されていることが原因である可能性が最も高いposition:absolute
です。
この問題を回避するにはどうすればよいですか?