CSS는 - 다른 순서 (Z- 인덱스?) 중첩 된 div 렌더링

Question

내가 부모가 오버 플로우-Y를 가지고있는 동안, 부모에 걸쳐 나타나는 중첩 된 DIV를 갖고 싶어 :

<div id="parent"><div id="child"></div></div> 

그리고 CSS를 스크롤 :

를

#parent { 
    position: absolute; 
    width: 150px; 
    height: 150px; 
    background-color: green; 
    overflow-y: scroll; 

} 

#child { 
    position: absolute; 
    width: 100px; 
    height: 100px; 
    top: 70px; 
    background-color: red; 
    z-index: 2; (????) 
} 

원하는 항목은 실제로 오버플로 속성을 활성화하지 않고 초록색 테두리 바깥과 밖에서 실제로 나타나야합니다. 하지만 부모를 통해 렌더링 된 다음 스크롤 막대가 오버플로됩니다. 그래서 그것은 자연스럽게 존재하지만 부모님을 넘어서는 것이지요. 그리고 나는 슬프게도 오버플로 속성을 버릴 수 없습니다. 나는 단지 하나의 요소에 대해 그것을 무시하고 그것을 overflow하기 위해 꽤 많이 변경하고자한다 : visible.

Answer 1

자식 캔트 종료 부모의 DIV. position : absolute 또는 심지어 두 개의 다른 부모 div를 사용해야합니다. 트릭 솔루션 https://philipwalton.com/articles/what-no-one-told-you-about-z-index/

을 그리고 여기에 CSS는 다음과 같습니다 : https://css-tricks.com/almanac/properties/z/z-index/

행운을 빌어 요, 단지 jsFiddle의 코드를 게시 할 다음 번에

는 여기를 참조하십시오.