2012-08-13 155 views
2

我遇到了一些CSS試圖讓我的下拉菜單中的每個元素後面的一些1像素實線黑色線條的問題。這是我的菜單貌似現在css菜單樣式

current

這是我希望它看起來像只是我把border: 1px solid black;該線路。菜單裏一{},但我不希望它適用於該草圖按鈕在此圖片中具有雙邊框。

我該如何解決這個問題?對於下拉元件在畫面

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; 
    } 
+0

您可以添加菜單的HTML嗎? – nerdherd 2012-08-13 02:52:17

回答

2

更改爲:

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

這樣,您將分別設置VERT和HORZ邊框寬度。您也可以將玩弄通過指定個別border-topborder-left

1

爲避免你可以試試這個問題:

CSS代碼

.menu li a{ 
     border:none; 
    } 

否則

.menu li{ 
     border:none; 
    } 

即你必須停止其中一個。請申請一個。如果使用.menu li邊框,則不需要爲.menu li a使用邊框,反之亦然。

+0

@ Undermine2k!代碼工作? – Codegiant 2012-08-13 05:59:35

+0

不幸的是,沒有解決它,我只在.menu li a {}上應用邊框。{} – Undermine2k 2012-08-14 11:09:40