絶対配置されたdivの幅が、firefoxでの子画像の幅の問題と等しくない

Question

divとimageは絶対位置に配置されています。問題は、ファイアフォックスには、分詞のdivの幅は、子のイメージよりも大きいです。 chormeで、つまりそれはうまく見えます。誰でも助けることができますか？ここには linkがあります。 左にスクロールして地図を見てください。ここ

は、ここでは、HTML

<div class="rm"> 
     <img src="images/ride_map.jpg" alt="ride map" class="img-responsive center-block" /> 
     <div class="path"><img src="images/path1.png" alt="ride map" class="img-responsive animated infinite flash"/></div> 
     <div class="path2"><img src="images/path2.png" alt="ride map" class="img-responsive animated infinite flash"/></div> 
     <div class="path3"><img src="images/path3.png" alt="ride map" class="img-responsive animated infinite flash"/></div> 
     <div class="path4"><img src="images/path4.png" alt="ride map" class="img-responsive animated infinite flash"/></div> 
     <div class="path5"><img src="images/path5.png" alt="ride map" class="img-responsive animated infinite flash"/></div> 
     <div class="path6"><img src="images/path6.png" alt="ride map" class="img-responsive animated infinite flash"/></div> 
     <div class="path7"><img src="images/path7.png" alt="ride map" class="img-responsive animated infinite flash"/></div> 
     <div class="path8"><img src="images/path8.png" alt="ride map" class="img-responsive animated infinite flash"/></div> 
     <div class="path9"><img src="images/path9.png" alt="ride map" class="img-responsive animated infinite flash"/></div> 
     <div class="path10"><img src="images/path10.png" alt="ride map" class="img-responsive animated infinite flash"/></div> 
     </div> 

である私はそれがうまく働いたことの後に、パスにwidth属性を追加する必要がありましたCSS

/*day1*/ 

.path { 
    position: absolute; 
    bottom: 4.8%; 
    left: 23.4%; 
    height: 22.6%; 
} 
.path img { 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 
} 
/*day2*/ 

.path2 { 
    position: absolute; 
    bottom: 4.7%; 
    left: 43%; 
    height: 13.5%; 
} 
.path2 img { 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 
} 
/*day3*/ 

.path3 { 
    position: absolute; 
    bottom: 16.5%; 
    right: 11.7%; 
    height: 13%; 
} 
.path3 img { 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 
} 
/*day4*/ 

.path4 { 
    position: absolute; 
    bottom: 27.5%; 
    right: 12%; 
    height: 21%; 
} 
.path4 img { 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 
} 
/*day5*/ 

.path5 { 
    position: absolute; 
    right: 17.7%; 
    bottom: 46.8%; 
    height: 21%; 
} 
.path5 img { 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 
} 
/*day6*/ 

.path6 { 
    position: absolute; 
    right: 33.5%; 
    top: 18%; 
    height: 16%; 
} 
.path6 img { 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 
} 
/*day7*/ 

.path7 { 
    position: absolute; 
    left: 24.5%; 
    top: 9%; 
    height: 10.6%; 
} 
.path7 img { 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 
} 
/*day8*/ 

.path8 { 
    position: absolute; 
    left: 24.2%; 
    top: 9.1%; 
    height: 26%; 
} 
.path8 img { 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 
} 
/*day9*/ 

.path9 { 
    position: absolute; 
    left: 22%; 
    top: 33.5%; 
    height: 34%; 
} 
.path9 img { 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 
} 
/*day10*/ 

.path10 { 
    position: absolute; 
    left: 23.3%; 
    top: 65.5%; 
    height: 9%; 
} 
.path10 img { 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 
} 

Answer 1

です。

/*day1*/ 
.path { 
    position: absolute; 
    bottom:4.8%; 
    left: 23.4%; 
    height: 22.6%; 
    width: 22%; 
} 
.path img{ 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 

} 

/*day2*/ 
.path2 { 
    position: absolute; 
    bottom: 4.7%; 
    left: 43%; 
    height: 13.5%; 
    width: 29%; 

} 
.path2 img{ 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 

} 

/*day3*/ 
.path3 { 
    position: absolute; 
    bottom: 16.5%; 
    right: 11.7%; 
    height: 13%;width: 20%; 

} 
.path3 img{ 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 

} 

/*day4*/ 
.path4 { 
    position: absolute; 
    bottom: 27.5%; 
    right: 12%; 
    height: 21%;width: 8%; 

} 
.path4 img{ 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 

} 

/*day5*/ 
.path5 { 
    position: absolute; 
    right: 17.7%; 
    bottom: 46.8%; 
    height: 21%;width: 18.78%; 
} 
.path5 img{ 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 

} 

/*day6*/ 
.path6 { 
    position: absolute; 
    right: 33.5%; 
    top: 18%; 
    height: 16%;width: 16%; 

} 
.path6 img{ 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 

} 

/*day7*/ 
.path7 { 
     position: absolute; 
    left: 24.5%; 
    top: 9%; 
    height: 10.6%;width: 28.55%; 



} 
.path7 img{ 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 

} 

/*day8*/ 
.path8 { 
    position: absolute; 
    left: 24.2%; 
    top: 9.1%; 
    height: 26%;width: 7.8%; 

} 
.path8 img{ 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 

} 

/*day9*/ 
.path9 { 
position: absolute; 
    left: 22%; 
    top: 33.5%; 
    height: 34%;width: 5%; 


} 
.path9 img{ 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 

} 

/*day10*/ 
.path10 { 
    position: absolute; 
    left: 23.3%; 
    top: 65.5%; 
    height: 9%; 
    width: 3%; 
} 
.path10 img{ 
    padding: 0 !important; 
    background: transparent !important; 
    height: 100%; 

}