미해결
플렉스(Flex) 반응형 웹사이트 포트폴리오(The World's Best Cities)
hover last-child() 인식이 되지 않습니다.
<style>
.contents{
position: relative;
padding-bottom: 50px;
z-index:9;
}
.sb_menu{
position: absolute;
margin-top:-25px;
display: table;
border-collapse: collapse;
table-layout : fixed;
width:100%;
font-size: 1.1em;
/* background-color: aqua; */
}
.sb_menu li{
display: table-cell;
border:1px solid #dcdcdc;
background-color: #fff;
border-top:none;
text-align: center;
}
.sb_menu li.on{
background-color: #2d3c47;
border-left:none;
}
.sb_menu li a{
display: block;
width:100%;
padding:17px 0;
/* border:1px solid red; */
}
.sb_menu li.on a{
color: #fff;;
}
.sb_menu li a:hover{
background-color: #2d3c47;
color: #fff;;
}
.sb_menu li a:hover:last-child(){
border-right:none;
}
</style>
<section class="contents inner">
<div class="sb_menu">
<li class="on"><a href="#" >사업개요</a></li>
<li><a href="#">브랜드소개</a></li>
<li><a href="#">오시는길</a></li>
</div>
</section>
/*****************************************/
아래 부분이 인식이 되지 않습니다.
.sb_menu li a:hover:last-child(){
border-right:none;
}
마지막 박스 에 마우스 올리면 오른쪽 줄이 나오지 않게 하려고요..
a:hover:last-child() 이렇게 사용하면 안되는건가요?
