-
카테고리
-
세부 분야
웹 개발
-
해결 여부
미해결
10:51에 질문있습니다.
20.09.04 23:00 작성 조회수 75
1
.navi li a:before요소에 overflow :hidden 을 넣어야지만
before요소가 감춰지게 되는데 이 원리(?)가
이해가 되질 않습니다...
before는 a에 absolute된 상태로 top:0 , left:0 에서
width 값만 없는 상태로 있는건데 overflow:hidden이 되면
position: relative로 되어있는 a가 더 상위(?)로
올라오게 되는 개념인가요?
답변을 작성해보세요.
3
코딩웍스(Coding Works)
지식공유자2020.09.06
a:before가 호버 전에 width: 0 입니다. 그럼 width는 0 이지만 그 안에 있는 내용은 여전히 보이고 있습니다.
그래서 overflow: hidden을 주면 width: 0인 만큼 나머지는 히든되어 있습니다.
a:before의 width가 늘어나면서 넘친 부분이 적어지면서 넘치지 않은 부분이 색이 칠해지는 효과가 납니다.
a는 부모요소니까 relative, a:before는 자식요소이니까 absolute입니다.
이런 경우는 z-index로 a:before를 높여줄 필요는 없는 듯 합니다.
0
답변 2