다른 요소를 제어하는 요소

고정 헤더가 있습니다. 스크롤 할 때 특정 요소가 머리글을 덮습니다. 어떻게 제어합니까? 내용 위에 헤더 우선 순위를 부여해야 위의 라인을 추가다른 요소를 제어하는 요소

#headercontainer { 
    z-index:1; 
} 
#contentcontainer { 
    z-index:-1; 
}

: 당신은 div에 대한 Z- 인덱스를 설정해야합니다

#headercontainer { 
    z-index: 10; 
}

출처

2011-04-06 Jake

placekit을 사용하기위한 보너스 포인트입니다. –

@Matt 전적으로 남자, 그건 그 중 하나 또는 찰리 광이 자리 표시 자;) – Jake

오, 남자, 나는 그 _think_조차하지 않았다! 'mind = blown' –

출처

2011-04-06 21:08:10 Bendihossan

나의 대답에 따르면, 그들 중 하나만이 Z- 인덱스 세트를 필요로한다. –

매우 사실, 난 그냥 난 -1의 Z - 인덱스 매우 하단에 머물고 싶어한다는 것을 알고 무언가를 설정하는 습관이있다 : – Bendihossan

는 #headercontainer에게 높은 Z- 인덱스주세요 컨테이너.

출처

2011-04-06 21:06:59

고마워요! 나는 전에 이것을 만난 적이 없다. – Jake

내 머리 꼭대기에서 빨리 생각할 수있는 두 가지 해결책이 있습니다. 두 번째 솔루션에서 ...

#headercontainer { 
    /* ... other CSS ... */ 
    position: fixed; 
    top: 0px; 
} 

#contentcontainer { 
    /* ... other CSS ... */ 
    margin-top: 125px; /* this should be at least the height of the header */ 
}

을 당신도 ...

#headercontainer { 
    /* ... other CSS ... */ 
    z-index: 1000; 
}

을 #headercontainer A 원소 z-index CSS property를 제공 할 수 있습니다 ... 또는 당신은 그것을 나는 그것을 수행해야 생각하는 방법을 수행 할 수 있습니다 어떤 요소가 다른 요소 위에 올랐는지 걱정할 필요가 없습니다. #contentcontainer 요소는 #headercontainer 요소 아래에 올바르게 겹쳐져 있으므로 겹치지 않습니다.

이 정보가 도움이되기를 바랍니다.
Hristo

출처

2011-04-06 21:14:26 Hristo

+1,이 확실히 더 나은 솔루션입니다. 처음에는 이것을 시도했지만,'header {top : 0}'이 빠져있어서 실제로 작동하지 않았습니다. –

옵션과 당신의 의견에 감사드립니다. 나는 정말로 Z- 인덱스에 익숙하지 않아서 아마 두 번째 옵션으로도 갈 것입니다. – Jake

다행입니다! – Hristo

다른 요소를 제어하는 ​​요소

답변

관련 문제

다른 요소를 제어하는 요소