CSSで背景画像を維持しながらテキストを移動する

Question

私は、y軸上で繰り返される背景画像を含む 'main_menu' divを持っています。このdivの上には、ヘッダーに使用される別のdivがあります。問題は、ヘッダーdivの高さが約75ピクセルの画像があることです。私は、main_divの背景イメージが実際に始まる場所から約50ピクセル高いmain_divのテキストを開始したいと思います。

私のようなものを考えていた：これは実際に動作しません

position:absolute; top:-50px; 

。 質問は、背景画像を通常の場所に保ちながら、テキストをどのように動かすかです。

おかげで

{EDIT}

はここCSS

.menu_main 
{ 
background-image:url('../menu_main.jpg'); 
background-repeat:repeat-y; 
width:173px; 
padding:5px;  

} 
.menu_header 
{ 
background-image:url('../menu_header.jpg'); 
text-align:center; 
width:173px; 
height:65px; 
padding:5px;  
} 

だあなたは、ヘッダーはかなり背が高いことがわかりますように、これは、HTML

<div class="menu_header">Some Header</div> 
<div class="menu_main"> 
    <ul> 
     <li>Educational Objective</li> 
     <li>Projects</li> 
     <li>Class Preparation</li> 
     <li>Testimonials</li> 
    </ul> 
</div> 

です。

background:url(someimage.png) repeat-y left 50px; 

この移動します：だから私はあなたが絶対位置でやっていたようにそれを移動し、そうのような背景を下に移動することができ

Answer 1

マイナスの余白を使用してください。 UL .menu_main

{マージントップ：-50px;}

Answer 2

までは50px高についてmenu_main divの中にテキストを開始したいと思いますあなたのbgイメージは50pxダウンします。

私はあなたがスクリーンショット以上のコードやライブの例を提供する場合より多くのを助けることができるかもしれない...

Answer 3

あなたは特にあなたのULのスタイルを設定できます。

.nav 
{ 
    position: relative; 
    top: -50px; 
} 

と

<ul class="nav"> 
... 

あるいは、ULを別のDIVクラス= "nav"に入れてください。

Answer 4

しかし、あなたは（5つのピクセルなど）の背景を下に移動することができます：あなたのコードの

background-position: top 5px;