子要素が相対位置を使用するときにクロムのボーダー半径は無視されます

Question

私は円形のdivを使用して画像を並べて、円のdiv内で画像をドラッグすることができます。次のようにアプリの

マークアップは、次のとおり

<div id="LookingGlass" class="looking-glass" style="margin:0 auto;"> 
    <div class="looking-glass-images"> 
     <img src="/wp-content/uploads/2011/11/CCDS_Ext_008a-copy.jpg" width="1250" height="980" /> 
     <img src="wp-content/uploads/2011/11/CCDS_Ext_011.jpg" width="967" height="1250" /> 
     <img src="wp-content/uploads/2011/11/CCDS_Ext_012.jpg" width="1250" height="962" /> 
     <img src="wp-content/uploads/2011/11/CCDS_Int_005.jpg" width="912" height="1250" /> 
     <img src="wp-content/uploads/2011/11/CCDS_Int_008.jpg" width="1250" height="833" /> 
    </div> 
    <ul class="looking-glass-nav"></ul> 
</div> 

jQueryのは、現在の画像をフェードアウトし、クリックされた方にフェードイン番号のNAVオブジェクトをautopopulates。私は、彼らが相対的な位置のスタイルを与えられたとされてから画像を含むdiv要素を停止し、いくつかの理由でされている画像にドラッグ可能な効果を課す場合はここで

はサスオブジェクトのコードだけでなく

@mixin border-radius($size) 
    border-radius: $size 
    -webkit-border-radius: $size 
    -moz-border-radius: $size 

.looking-glass 
    display: block 
    height: 100% 

    .looking-glass-nav 
     li 
      display: inline 
      padding: 5px 

    .looking-glass-images 
     overflow: hidden 
     display: block 
     height: 500px 
     width: 500px 
     @include border-radius(50%) 

     img 
      -webkit-user-select: none 
      -moz-user-select: none 
      user-select: none 
     img.active 
      display: block 
     img.inactive 
      display: none 

です丸い。これはChromeのバグですか、私がここで間違っていることはありますか？

Answer 1

これは、ベンダープレフィックスを書くための正しい方法は、この方法のように、最後の位置にnonvendorプロパティ名を置くことです あなたを助けることができる可能性があり：

-webkit-property: value; 
    -moz-property: value; 
    -ms-property: value; 
    -o-property: value; 
     property: value;