SVG剪辑路径仅适用于头等舱

Question

我正在尝试将剪辑路径应用于多个div，但Safari似乎只是将剪辑路径应用于第一个实例。下面是精简代码。我还把你可以在这里找到的笔放在一起 - ＆gt; http://codepen.io/hillspro/pen/GjYRAA

HTML

<div id="container">
   <div class="object"></div>
   <div class="object"></div>
   <div class="object"></div>
   <div class="object"></div>
</div>

<svg width="0" height="0">
 <defs>
   <clipPath id="clip-shape" clipPathUnits="objectBoundingBox" >
    <polygon points=".5,0 .95,.25 .95,.75 .5,1  .05,.75 .05,.25"/>
   </clipPath>
 </defs>
</svg>  

INLINE - CSS

.object{
  display:inline-block;
  margin:15px;
  background:brown;
  width:200px;
  height:200px;
  clip-path:url('#clip-shape'); 
  -webkit-clip-path:url('#clip-shape');
}