2013-10-18 6 views
0

나는 목록을 가지고있다. 그 중 하나는 li:hover이고 li은 아래쪽 경계선을 얻는다. 불행히도 이로 인해 인접한 두 개의 테두리가 생기므로 이제는 2px 넓지 않아 좋지 않습니다. 그래서 내가 그냥 호버에 margin-bottom:-1px;에 척 수 있고 괜찮을 거라 생각하지만, 불행히도 하단 요소는 현재 하나를 중복, 그래서 잘못된 테두리 색상을 받고 있어요.CSS에서 음수 여백을 사용하여 겹침 순서를 변경할 수 있습니까?

나는 희망을 가지고 z-index:1;을 시도했지만 아무 것도하지 않습니다. 나에게 그것은 그렇게하는 길이어야한다. W3C에 와라!

내가 position을 사용할 수 없습니다

  • absolute이있는 나는의 흐름으로 그것을 필요로 더 이동합니다.
  • relative은 부모 ul에 상대적인 위치가 필요한 ul의 자식이있는 li입니다.

이전 요소가 음수 여백을 추가 할 때 다음 요소와 겹칠 수있는 방법이 있습니까?

지금은 아마도 jQuery 해킹을해야 할 것입니다. CSS를 통해 모든 작업을 완료하는 데 너무 가깝습니다.

+0

피딩 할 수 있습니까? 그것은 이해하기 쉬울 것입니다 – Hiral

+0

@Hiral This - http://jsfiddle.net/2nNzS/ - 기본 아이디어입니다. 요소 위로 마우스를 가져 가면 위쪽 및 아래쪽 테두리가 모두 검은 색으로 표시됩니다. 그러나 불행히도, 대신 당신은 중복을 참조하십시오. – andrewb

답변

1

질문을 이해할 수 있는지 확실하지 않지만, 경우에 따라 adjacent sibling selector을 사용해보세요. 귀하의 질문을 올바르게 이해하면 다음과 같이 작동해야합니다.

li:hover + li{border-top:none !important;} 

어쩌면 당신은 중요한 선언이 필요하지 않을 수도 있습니다. 또한이 기법을 사용하면 언급 한 바와 같이 (또는 원하는대로) 음수 마진을 사용할 수 있습니다.

+0

네가 그것을 이해 했음에 틀림 없다. 인접한 셀렉터에게 내 마음을 열어 주셔서 감사 드리며 잠재력을 되찾아주십시오! 나는'! important'를 사용할 필요가 없었습니다. CSS로 그것을 피하기 위해 많은 노력을했습니다. – andrewb

+0

도움이 될 수있어서 기쁩니다 :) – Devin

관련 문제