x リピートの背景を持つサイトにロゴとメニューを配置したいのですが、これら 2 つを常に背景の同じ領域に表示したいと考えています (背景には明るいストライプがあり、ロゴは常にその範囲内にあり、メニュー項目はそれより少し下にあるはずです)。
ロゴとメニューの画像は画面サイズに応じて拡大縮小され、背景が繰り返されるだけなので、y 軸で機能させることができません。これを行う方法はありますか?
このページは sarahreesbrennan-fans (dot) com です。見れば、私の言いたいことがわかるでしょう。(これは、誰かが説明から想像できない場合に備えて、私が話していることを確認するためのものです)。
ページの私のコードは次のとおりです。
<div id="bg_wrapper"><img src="/wp-content/uploads/2013/08/floral.png" /></div>
<div id="logo"><img src="/wp-content/uploads/2013/08/logo1.png" width="50%" /></div>
そしてCSS：
body {
color: #444444;
font-family: verdana, sans-serif;
font-size: 10pt;
background: url(/wp-content/uploads/2013/08/page-back.gif) repeat-x #22221f;
}
#bg_wrapper {
position:absolute;
z-index:-1;
width:100%;
text-align:center
}
#logo {
padding-top: 3%;
padding-left: 3%;
}
どうもありがとう！