Вы используете устаревший браузер. Этот и другие сайты могут отображаться в нём некорректно. Вам необходимо обновить браузер или попробовать использовать другой.
Как яркий пример, первая часть кода работала сразу, я написал об этом в самом начале. Что не возможно при корректной работе static, так же не работающая вторая часть кода, что невозможно при корректной работе relative.
Думаю что проблема в том что большое наслоение свойств и классов. Адаптация заработала только после явного указания свойства релатив или абсолют для тега @media.
Проблема решена, дело было в том что свойства top и right не влияют на position: static;
Нужно было указать position: absolute; или position: relative; в свойствах @media. Рабочий код:
.compare
{
width: 70px;
height: 30px;
line-height: 20px;
padding: 0 10px...
В таком виде все работает без каких либо изменений:
.compare
{
width: 70px;
height: 30px;
line-height: 20px;
padding: 0 10px !important;
padding-right: 20px !important;
padding-bottom: 10px !important;
}
@media only screen and (max-width: 1920px)...
tuxfighter поправь плз если можешь, не работает :(. Работает только первая часть @media для 1920.
@media only screen and (max-width: 1920px), only screen and (max-device-width: 1920px) {
.compare
{
right: -500px;
top: -720px;
width: 70px;
height: 30px...
Всем привет! Подскажите пожалуйста как отредактировать место положение и размер кнопок на странице сетки товаров. Я хочу передвинуть кнопку "сравнить" в правый верхний угол и уменьшить ее. А кнопку "в корзину" растянуть на всю ширину мини изображения. Подскажите пожалуйста как это сделать или...