0
I абсолютное расположение div и изображения внутри этого. проблема заключается в том, что в firefox ширина partent div больше, чем у ребенка. В chorme и т. Д. Это выглядит хорошо. Кто-нибудь может помочь? здесь находится link. прокрутите вниз и посмотрите на карту слева.Абсолютная располагаемая ширина div, не равная размеру ширины дочернего изображения в firefox
здесь 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>
здесь 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%;
}
Это выглядит так же, как в Firefox и Chrome. Какую версию Firefox вы проверяете? –
Я добавил атрибут width, и теперь все в порядке. Благодарю. – Sasith