Html 圆角，1个角仍然很尖锐

这是一个很好的话题，但我找不到任何与我的确切问题相关的东西。我检查了很多！ 所以我的问题是，我在我的一个div上使用圆角，没有问题，然后我将css复制到我的第二个div，它位于第一个div下面。上面的div有可爱的圆角，而下面的div在左上角有一个尖角。从我所读到的以及边界半径属性的工作原理来看，我认为这是不可能的。它在firefox、chrome和IE上也做了同样的事情。 这里是指向css和html的链接。

我将代码添加到codepen中，它运行良好，但是在所有浏览器中仍然存在尖角问题。 任何帮助都会很好。

---

提前感谢

一个跨浏览器边界半径的解决方案

.my-block {
  -moz-border-radius: 10px; /* Firefox */
  -webkit-border-radius: 10px; /* Safari, Chrome */
  -khtml-border-radius: 10px; /* KHTML */
  border-radius: 10px; /* CSS3 */
  behavior: url(border-radius.htc); /* IE border-radius */
}

---

我怀疑这是因为你在角落里的形象。不幸的是，在Codepen示例中，您没有提供指向图像的工作链接，但是如果您将其注释掉

  <!--
  <img src="../../titles/the barn (Copy).jpg" alt="The Barn">
   -->

您可以看到，实际上，边界半径的应用是正确的

---

图像有白色背景吗？也许您可以移动它，留一点空白

隔离代码中存在问题的部分。#bubble1{位置：相对；顶部：-50px；宽度：1013px；高度：2500px；背景：#FFFFFF；位置：相对；边框半径：10px；-moz边框半径：10px；-khtml边框半径：10px；-webkit边框半径：10px；-moz方框阴影：0px 0px 8px rgba（0,0,0.3）；-khtml方框阴影：0px 0px 8px rgba（0,0,0,0.3）；-webkit盒阴影：0px 0px 8px rgba（0,0,0.3）；盒阴影：0px 0px 8px rgba（0,0,0.3）；}@Bee请更新您的问题并将其添加到评论中，而不是添加相应的代码。很抱歉，stack非常新，下次将这样做。感谢您的建议。是的，图像有白色背景。您的解决方案解决了此问题。谢谢！