z 색인 문제 navmenu가 겹쳐지지 않습니다.

Question

상단 영역과 하단 영역 사이에 동일한 링크를 두 개 겹치도록 연결하려고합니다. navmenu div를 다른 모든 div보다 큰 z- 인덱스로 설정했지만 아무 것도 겹치지 않게 할 수 있습니다. http://www.joekellywebdesign.com/churchsample1/index.html

스타일 시트가 도움을 사전에 http://www.joekellywebdesign.com/churchsample1/css/styles.css

감사에 있습니다에서 사이트입니다.

Answer 1

여러 가지 방법이 있습니다.

당신은 단순히 당신의 navmenu 당신이 div의 위치가 이전 div에 따라 달라집니다 의미 상대적으로 위치를 지정했기 때문에

#navmenu { 
    margin: -10px 0; 
} 

에 대한 부정적인 여백을 지정할 수 있습니다. 그것의 정상은 이전의 div의 최고 플러스 높이가 될 것입니다.

위치를 absolute으로 변경하거나 div 안에 콘텐츠를 표시 할 여백 또는 패딩 값을 조정할 수 있습니다.

z-index은 요소가 겹칠 때만 적용됩니다. 귀하의 경우 모든 div은 상대적인 위치에 있습니다. 그들 중 누구도 중복되지 않습니다.

Answer 2

당신은 예를 들어 다음을 수행 할 수 있습니다 :

<div id="navmenu"> 
     <div class="inner"><h1>Test text</h1></div> 
</div> 

및보다

CSS에 : 여기

#navmenu .inner { 
padding-bottom: 15px; 
margin-top: -15px; 
position: relative; 
z-index: 200; 
background-color: #F00; 
}