Question

当我在包装UL的DIV上使用border-radius时，在将链接悬停在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类下，你必须删除位置：relative。

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

我已更新相同的here。你可以看看。希望这会有所帮助。

Chrome中的边框半径更改

3 个答案: