html - Chrome中的边框半径变化

Question

当我在包装 UL 的 DIV 上使用边框半径时，将链接悬停在 UL 内后，我在 Chrome 中失去了半径。

<div class="menu">
<div class="middle">
    <ul class="bmenu">
        <li><a href="#home"/>Home</a></li>
        <li><a href="#cv"/>CV</a></li>
        <li><a href="#projects"/>Projects</a></li>
        <li><a href="#contact"/>Contact</a></li>
    </ul>
</div>
</div>

这是示例：http: //jsfiddle.net/TYgP6/

任何人都可以帮忙吗？

Answer 1

.bmenu{
    padding: 0px;
    margin: 0 0 10px 0;
    width:100%; 
height:60px;    
    color:#000;
    border-top-left-radius: 10px;   
    border-top-right-radius: 10px;  

尝试
使用此代码替换您的代码。您给出了相对于.bmenu您需要删除的位置。

Answer 2

为 Webkit 的 CSS 属性添加前缀 - -webkit-border-radius:10px 10px 0 0;- 应该可以解决它。

Answer 3

在 bmenu 类下，您必须删除 position:relative。

.bmenu{/*position:relative;*/}

我在这里更新了同样的内容。你可以看看。希望这可以帮助。