CSS 메뉴 스타일링

드롭 다운 메뉴의 각 요소 뒤에 내 드롭 다운 표에 1px 검정색 선을 제공하려는 일부 CSS에 문제가 있습니다. 이것은 나의 메뉴의 모습을 지금CSS 메뉴 스타일링

current

이 나는 그것이 내가 border: 1px solid black; .menu 리튬 a를 {}에서이 라인을 넣어 제외하고는 같이 할 것입니다하지만 난 그것을 적용하지 않으려는 초안 버튼에는이 그림에 이중 테두리가 있습니다.

어떻게 해결할 수 있습니까? 사진의 요소에 대한 드롭 다운

enter image description here

번호.

.menu .dropdown_1col { margin:4px auto; left:-999em; position:absolute; background:#F4F4F4; border: 1px solid black; text-indent:15px; background: -moz-linear-gradient(top, #EEEEEE, #BBBBBB); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#EEEEEE), to(#BBBBBB)); }

.menu li { 
     float:left; 
     text-align:center; 
     position:relative; 
     padding: 4px 10px 4px 10px; 
     margin-right:30px; 
     margin-top:7px; 
     border:none; 

    } 
    .menu li:hover { 
     z-index:2; 
     background:#F4F4F4; 
     border:1px solid #aaaaaa; 
     padding: 4px 9px 4px 9px; 


     /* CSS 3 Stylings */ 

     background: -moz-linear-gradient(top, #F4F4F4, #EEEEEE); 
     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F4F4F4), to(#EEEEEE)); 

    } 
    .menu li a { 
     color: #EEEEEE; 
     outline:0; 
     text-decoration:none; 
     display:block; 
     text-shadow: 1px 1px 1px #000; 


    } 
    .menu li:hover a { 
     color:#161616; 
     text-shadow: none; 
    } 
    .menu li .drop { 
     padding-right:21px; 
     background:url("img/drop.png") no-repeat right 8px; 
    } 
    .menu li:hover .drop { 
     padding-right:21px; 
     background:url("img/drop.png") no-repeat right 7px; 
    } 
    .menu li:hover div a { 
     color:#444; 
    } 
    .menu li:hover div a:hover { 
     color:#777; 
    } 
    .menu li ul li a:hover { 
     color:#777; 
    }

출처

2012-08-13 Undermine2k

메뉴에 HTML을 추가 할 수 있습니까? – nerdherd

변경하려면 다음

{ 
    ......... 
    border: 1px 0px solid #aaaaaa; 
    ......... 
}

따로 버트와 수평 경계의 폭을 설정합니다 이쪽으로. 또한 지정하여 놀러 택시 등 border-leftborder-top 개별

출처

2012-08-13 02:53:54

이 시도 할 수있는 문제를 방지하려면 : 그렇지

CSS 코드

.menu li a{ 
     border:none; 
    }

을

.menu li{ 
     border:none; 
    }

중 하나를 중지해야합니다. 하나를 신청하십시오. .menu li border를 사용하면 .menu li 또는 그 반대로 border를 사용할 필요가 없습니다.

출처

2012-08-13 05:38:28 Codegiant

@ Undermine2k! 코드가 작동합니까? – Codegiant

불행히도 그 문제를 해결하지 못했습니다. 국경 만 적용합니다. – Undermine2k

CSS 메뉴 스타일링

답변

관련 문제