我有一些代码看起来像这样：
<div id="shell">
<div id="title">TITLE HERE</div>
<div id="content">Article Content Goes Here</div>
</div>
shell div有一个灰色边框，我想要圆角。我遇到的问题是标题div有一个绿色的背景，它与外壳的圆角重叠。它或者重叠或不突出在边缘以提供流畅的外观。
我正在寻找与IE 7和8向后兼容的解决方案，但如果HTML5中有一个解决方案很简单，我会愿意失去这些浏览器。
谢谢！
解决方法
在你的标记中，你必须给#shell和#title赋予border-radius，所以#标题的尖角不与#shell重叠。
一个现场的例子，http://jsfiddle.net/BXSJe/4/
#shell {
width: 500px;
height: 300px;
background: lightGrey;
-moz-border-radius: 6px;
border-radius: 6px; /* standards-compliant: (IE) */
}
#title {
background: green;
padding: 5px;
-moz-border-radius: 6px 6px 0 0;
border-radius: 6px 6px 0 0; /* standards-compliant: (IE) */
}
