Chrome边界半径缩放？

Question

之前从未遇到过此问题，我无法看到任何其他引用。基本上，我有一个顶部和底部容器上有圆角的网站。现在，这些都工作得很好，但是自从我开始解决IMG DECODING FAILED问题后突然停止了。我已经解决了这些问题（我认为），但现在，我的圆角在容器底部无法正常工作。

我的CSS如下：

.sub_footer {
  background: url(/uploads/images/blue_footer_bg.jpg)repeat-x;
  color: #fff;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  text-shadow: 0px 1px 10px rgba(1, 1, 1, 1);
  overflow: hidden;
}

我使用css制作圆角而不是图像，因为我觉得它是一种更有活力的技术。

此css与顶部容器相同（除了其右上角和左上角的圆角）。

如果你想看到它的实际效果，你可以在这里查看网站：http://1074796728.1071867011.temp.prositehosting.co.uk/（这个网站不会让我发布图片）

底角略呈圆角但与顶部的角度不同，尽管这两个声明均为15px。

有人可以帮忙吗？

Answer 1

CSS 没有任何问题您应该更改页脚Div的高度请参阅

由于

Udit Bhardwaj

Answer 2

尝试更改此内容：

.sub_footer {
  background: url(/uploads/images/blue_footer_bg.jpg)repeat-x;
  color: #fff;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  text-shadow: 0px 1px 10px rgba(1, 1, 1, 1);
  overflow: hidden;
}

对此：

.sub_footer {
  background: url(/uploads/images/blue_footer_bg.jpg)repeat;
  color: #fff;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  text-shadow: 0px 1px 10px rgba(1, 1, 1, 1);
  overflow: hidden;
}

Answer 3

您好现在删除您在padded孩子中定义的sub_footer课程，现在

定义您的.sub_footer height: 30px; padding-top: 15px; 像这样

.sub_footer
{height: 30px;
padding-top: 15px;
}

结果是这个

Answer 4

更简单的解决方案是

只需将padding:15px;添加到col12类

下的课程sub_footer即可

.sub_footer .col12{
    padding:15px;
}

Answer 5

将webkit放在边框半径语句中。

-webkit-border-radius:
-moz-border-radius: