Z- 색인이 img에서 작동하지 않고 p가 div로 표시

서로 위에 위치 요소를 배치하는 데 문제가 있습니다. 이것은Z- 색인이 img에서 작동하지 않고 p가 div로 표시

First image

내가 달성하고자합니다 : 이것은 내가 무엇을 얻을

#glownySlajder { 
    margin-bottom: -2px; 
} 

#glownySlajder a { 
    margin: 7px; 
} 

#glownySlajder ul li img { 

    z-index: 9998; 
} 

#glownySlajder div {   
    z-index: 9999; 
    color: black; 
    background-color: #e7e7e7; 
    height: 85px; 
    width: 500px; 
    padding: 0px 5px; 

} 

#glownySlajder div p { 

    font-size: 11px; 
    line-height: 14px; 
    margin-top: 20px; 
    width: 390px; 
} 

.fr { 
    float: right; 
} 

.fl { 
    float: left; 
}

: 여기

<div id="glownySlajder"> 

       <ul> 
        <li> 
         <img src="inc/img/slajder_bg.jpg" alt="Slajd" class="slajd"> 
         <div class="fr"> 
          <a href="#" class="przyciskPoprzednia fl" title="Poprzednia"><img src="inc/img/strzalka_lewo.png" alt="strzalka_lewo"></a> 
          <p class="fl">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed laoreet consequat gravida. Nunc sed risus est, ac vestibulum nisl. Suspendisse sagittis velit a massa auctor accumsan. Aliquam hendrerit libero tellus, at molestie leo. Curabitur sodales </p> 
          <a href="#" class="przyciskNastepna fr" title="Następna"><img src="inc/img/strzalka_prawo.png" alt="strzalka_prawo"></a> 
         </div> 

        </li> 
       </ul> 
     </div>

내 CSS입니다 : 여기 내 마크 업입니다

Second Image

문제는 z- 인덱스가 작동하지 않는 것입니다. div에서 음수 여백을 p으로하면 이미지가 정확하게 사라지는 대신 이미지가 사라집니다.

혼자 힘으로 해결할 수 없습니까?

출처

2012-10-06 Michał Lach

우선 z-index은 블록 요소 (display:block)에서만 작동합니다. 둘째, 동일한 스태킹 컨텍스트에있는 요소에만 유용합니다. 셋째로, margin을 사용하지 마십시오. 이 경우 position: 및 top, left, right, bottom을 사용하십시오.

참고 :

출처

2012-10-06 17:22:07 Zeta

좋아,이 일을 감사합니다. 내가 위치 않았다 : div에 절대. –

이 문제를 발견 한 사람은 오버플로와 관련된 문제가 발생할 수 있습니다. 오버 플로우가 있는지 확인하십시오 : 숨김; 요소 구조 내 어디에서나 사용할 수 있습니다. 그게 내 문제를 일으키는 원인이 된거야. 오버플로로 변경 : 표시 가능; 내 img layering은 내가 원하는 방식으로 작동했다. – adpro

Z- 색인이 img에서 작동하지 않고 p가 div로 표시

답변

관련 문제