위치 고정 요소가 추가되면 위치 고정 머리글이 뒤쪽으로 이동합니다.

Z- 인덱스와 관련하여 위치 고정/상대/절대에 대한 많은 질문이 있습니다. 그러나 이러한 질문을 사용하여 내 질문을 파악할 수 없었습니다 .위치 고정 요소가 추가되면 위치 고정 머리글이 뒤쪽으로 이동합니다.

기본적으로 고정 헤더가 있습니다. 그것은 완벽하게 잘 작동, 모든 것을 뒤에 스크롤 페이지를 스크롤하십시오.

최근에 div id에 대한 링크를 추가하고 싶었지만 헤더를 설명하기 위해 link가 부모 요소 인 다음 코드를 추가해야했습니다. 그리고 linkTo는 ID가있는 클래스의 클래스입니다. 실제로에 연결하십시오. 이 기능은 헤더가 원하는 div 위에 오도록 올바른 오프셋을 제공하여 완벽하게 작동합니다.

.link {position: relative;} 
.linkTo {position: absolute; top: -80px;}

이 문제는 어떤 이유에서든 내 div가 페이지의 모든 것 뒤에 있다는 것입니다. 나는 여전히 그것을 볼 수 있지만 텍스트와 이미지는 앞에 있습니다.

9999와 같은 헤더에 z- 인덱스를 추가하려고했지만 작동하지 않습니다. 나는 위치 상대를 추가하는 것이 사물이 표시되는 순서를 어지럽히는 이유를 이해하지 못한다.

예를 들어 설명해 드리고 싶지만 코드는 다소 큽니다. 이것이 충분하지 않으면 나중에 jfiddle를 만들려고 노력할 수 있습니다.

출처

2013-04-30 Tom Prats

당신의 피들을 준비 했습니까? – Dolo

일부 코드는 도움이 될 것입니다. 문제가 주변 마크 업 또는 뭔가 ... 원인이 될 수 있기 때문입니다. 감사합니다! – Arkana

그래도 고마워! 다음번에 –

부모 요소에 position: relative; z-index:9999을 추가하면이 요소가 메뉴 안에 있습니다.

출처

2013-04-30 06:49:39

이 일은 그 자체로는 아무 것도하지 못했지만 위대한 일들을 이끌어 냈습니다. –

내 대답을 듣고 받아 들일 수 없다는 느낌이 들었습니다. 그래서 Z- 인덱스를 추가하고 더 명확하게 다시 헤더를 참조하십시오, 나는 당신의 것을 받아 들일 것입니다. –

Ganesh가 말했듯이, 머리글의 부모 요소에 상대적인 위치를 추가하는 것이 시작 단계였습니다. 그런 다음 같은 부모 요소에 z- 인덱스를 추가하면 문제가 완전히 해결되었습니다.

출처

2013-04-30 08:18:36

-1

상위 요소에 대해 z-index의 하위 요소를 확인하면 하위 요소의 Z- 인덱스보다 우선합니다.

드롭 다운 메뉴 및 jquery UI 탭을 사용하여 이전에 z-index 문제가 발생했습니다. 나는 그것이 stacking effects created us rules like opacity or transition과 관련이 있다고 생각했지만 나에게 문제는 하위 요소 인 z-index이있는 상위 요소였습니다.

출처

2013-11-25 22:21:39 user2449231

위치 고정 요소가 추가되면 위치 고정 머리글이 뒤쪽으로 이동합니다.

답변

관련 문제