2011-08-15 8 views
3

divにメッセージストリップを重ねるにはどうすればよいですか?div-container上の画像

Image over div-container

divの "NAV" の位置は固定されなければなりません。

<img src="images/diagonal_corner_message_strip.png" id="copyright" /><div id="nav"> 
    <ul> 
    <li><a class="top" href="#top"><span></span></a></li> 
    <li><a class="bottom" href="#bottom"><span></span></a></li> 
    <li><a>List</a></li> 
    <li><a>Create</a></li> 
    </ul> 
</div> 

#nav { 
    padding: 6px 0; 
    border-bottom:1px solid #ddd; 
    position:fixed; 
    width:100%; 
    top:0px; 
    left:0px; 
    right:0px; 
    margin:0; 
    background:#fff url(../images/navigation/nav.png) repeat-x center left; 
    z-index:999999; 
} 

img#copyright { 
    position:absolute; 
    top:0px; 
    left:0px; 
    right:0px; 
    float:left; 
} 

ありがとうございます!

答えて

4

z-index#navは、999999に設定されています。

z-indeximg#copyrightが設定されていません。

z-indexは、要素が表示される順序を定義し、最も高い値が上に表示されます。あなたの問題に対する解決策は簡単です。img#copyrightz-indexより高く、#navより高くなります。