html - 边框半径圆角成父子

Question

我在具有边界半径的 div 上悬停时遇到了一些问题。

当我悬停 div 时，有一条小线，其颜色与悬停颜色不相似。

html代码：

<div class="grid_veiw_case_active">
    <div> some text</div>

    <div class="delete_div">
        <div class="delete"><p class="button_text"></p></div>
    </div>

</div>

CSS（部分）代码：

.grid_veiw_case_active {
   border-style: solid;
   border-width: 1px;
   border-color: #404040;
   border-radius: 5px;
   background: #7d7d7d;  
   width: 254px;
}
.grid_veiw_case_active .delete {
   border-top: 1px solid #969696;
   width: 100%;
   height: 38px;
   -webkit-border-bottom-right-radius: 4px;
   -webkit-border-bottom-left-radius: 4px;
   -moz-border-radius-bottomright: 4px;
   -moz-border-radius-bottomleft: 4px;
   border-bottom-right-radius: 4px;
   border-bottom-left-radius: 4px;
   background: #c1c0c0;

}

.grid_veiw_case_active .delete:hover {
   background: #d06d70;

}

代码链接http://jsfiddle.net/Xbj3b/。
说明问题的图像

Answer 1

添加 border-radius: 0px;到悬停状态。