css - 边界半径部分 splinter

Question

我尝试了 overflow:hidden 解决方案来解决破坏 border-radius 的背景:http://jsfiddle.net/ypjDC/17/

<div style="width: 200px; border: 3px solid; border-radius: 7px; overflow: hidden;">
  <div style="float: left; width: 50px; background-color: #800000;">
    <p>test</p>
  </div>

  <div style="float: right; width: 50px; background-color: #800000;">test</div>

  <div style="clear: both;"></div>
</div>

但总有一个问题，你可以看到 Angular 落里有一点空白。

我该如何纠正？

Answer 1

您可以在主 DIV 中添加一个与边框颜色相同的内嵌框阴影:

<div style="width: 200px; border: 3px solid; border-radius: 7px; overflow: hidden;box-shadow: 0px 0px 0px 1px #000 inset;">

它稍微修改了您的边框外观，但删除了白色区域。

FIDDLE