css - 两个简单的 CSS 问题

Question

我有两个无法解决的简单问题：

1. 在“主页”上方时，您可以看到边界不再是半径。我能做些什么来修复它？

2. 当超过“服务”时，弹出菜单的右上角有一条灰线。我想丢弃它。

       <nav>
       <ul>
           <li><a id="homefix" href="#">HOME</a></li>
           <li><a href="#">ABOUT</a></li>
           <li><a id="serv" href="#">SERVICES</a>
               <ul>
                   <li><a href="#">Web Design</a></li>
                   <li><a href="#">Programming</a></li>
                   <li><a id="ecomfix" href="#">e-Commerce</a></li>
               </ul>
               </li>
           <li><a href="#">CONTACTS</a></li>
           <form>
           <input type="submit" class="searchsubmit" value="Search" />
           <input type="text" class="search" placeholder="Search" /> 
           </form>
       </ul>
   </nav>
   

http://jsfiddle.net/yuvalsab/M9D89/

非常感谢！:)

Answer 1

应用一个完整的border radius似乎工作。看起来还不错，在#homefix中似乎没有应用边框半径。为什么你不能这样做：

http://jsfiddle.net/M9D89/3/

Answer 2

nav ul li:first-child {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

nav ul li:last-child {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

http://jsfiddle.net/M9D89/6/