边境半径不在野生动物园工作

Question

我有一个带谷歌地图的页面，现在我正试图在其上设置边框半径。这适用于Chrome和Firefox等浏览器，但不适用于Safari。

您可以在此处找到该页面：clients.steven-dejong.nl/amano/#contact

编辑： 它正在使用地址块，如果我添加-webkit-border-radius和-moz-border-radius就没有意义了。

我的边框半径不起作用的唯一部分是谷歌地图容器

Answer 1

Safari中Google地图的边界半径

-webkit-mask-image：-webkit-radial-gradient（circle，white，black）;

-webkit-transform：translateZ（0）;

将此代码段用于地图iframe及其父div

Answer 2

使用-webkit前缀并执行以下操作：

 /* Safari 3-4, iOS 1-3.2, Android 1.6- */
  -webkit-border-radius: 12px; /* Adjust as needed */

Answer 3

使其适用于所有浏览器：

border-radius: 12px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;