웹킷 브라우저는 LI A (display : 블록) 요소를 숨 깁니다. 때때로

Question

'a'요소가 표시되도록 설정된 경우를 제외하고 고전적인 'ul li'기반 위에 빌드 된 (일종의 실험적) 메뉴입니다. 정확한 위치 지정 및 크기 조정을위한 블록입니다. 일부 변형 : rotate도 표시되지만 동작에 따라 영향을 미치지 않습니다.

웹킷을 제외한 모든 브라우저는 모든 메뉴 항목을 here과 동일하게 표시합니다. 그러나 웹킷은 하위 항목 ('항목 2a', '항목 2b', '항목 3a', ...)을 숨 깁니다. 링크는 나타나야하는 영역 위로 마우스를 가져 가면서 커서가 변경 될 때 분명히 표시되지만 보이지는 않습니다. 이상하게도 충분히 보이지 않는 요소의 크기를 지정된 공간 (부모 LI의 높이)과 약간 겹치도록 설정하면 볼 수 있습니다 (here)

여기에 무슨 일이 일어나고 있는지 알고 있니?

감사합니다.

Answer 1

개인적으로는 음수 여백과 CSS 로테이션을 결합하면 약간의 어려움이있을 수 있습니다. 내가 당신이라면

나는 절대 위치에 a.rotate 링크를 설정

1. 을 거라고, 그래서 그들은 흐름을 화나게하지 않습니다. http://jsfiddle.net/958qQ/는 나머지는 쉽게해야합니다 :
2. 내가 여기이 예제를 만들어 그것으로 부정적인 마진 조금

을

플레이를 덤프합니다.

Answer 2

마진을 사용하는 방법이 마음에 들지 않아 복잡합니다. 그것은 포지셔닝과 스타일을 더 잘한다고 생각합니다. 하위 요소의 절대 위치