Позиция абсолютная - хром и firefox

В настоящее время я работаю в магазине prestashop http://vps110594.ovh.net/.

У меня проблема с желтым прямоугольником с ценой на ящики продукта над нижним колонтитулом. Нижняя граница желтого ценового поля должна быть выровнена с верхней границей черного ящика с названием продукта и кнопкой "добавить в корзину". В Chrome он выровнен, но в Firefox это не так. Я столкнулся с этой проблемой раньше (разница между Firefox и Chrome при использовании позиции: относительная и абсолютная), и я решил применить встроенные стили для Firefox через JS (возможно, у вас есть другие решения?):

window.onload = browserName();

function browserName() {
    var browserName= navigator.userAgent;
    var isFirefox = browserName.search("Firefox");
    if (isFirefox > 0) {
        var elems = document.getElementsByClassName("cena_product");
        var size = elems.length;

        for (var i = 0; i < size; i++) {
            var box = elems[i];
            box.style.bottom = "10px";
        }
    }
} 

Во всяком случае на моем компьютере он выглядит нормально как в Chrome, так и в Firefox, но когда я проверил это на разных компьютерах, желтая рамка не выравнивается как в Chrome, так и в Firefox (одни и те же версии браузеров). Почему это?

0
источник поделиться
1 ответ

Я сделал простой пример того, что вам нужно: LINK.

Он работает точно так же во всех * браузерах.

Я бы предложил вам переписать свой код, так как это может привести к другим ошибкам в будущем.

Пример кода:

<li>
    <div class="item">
        <div class="image">
            <img src="http://vps110594.ovh.net/26-home_default/test.jpg" alt=""/>
        </div>
        <div class="buy">
            Buy now
            <div class="price">435$</div>
        </div>
    </div>
</li>

*Современное

0
источник

Посмотрите другие вопросы по меткам или Задайте вопрос