Страницы: 1
Заработало так как надо - СПАСИБО!!!
hr{border-top:1px solid #171616;background:url(images/headbg.png) 100%;height:1%;box-sizing:content-box;}
Дополнительно заменил height:1px; на height:1%; - ни на что это визуально не влияет, так на всякий случай.
Проверил ранее "проблемную линию" hr в смартфонах, планшетниках, браузерах - Firefox, Chrome, Яндекс.Браузер, Uran, Opera, IE, выглядит именно так как нужно! :rock:
Вот мой сайт ducenti ru и сейчас стиль такой:
hr{border:solid #ddd;border-width:1px 0 0;clear:both;margin:10px 0 30px;height:0;}
hr{border-top:1px solid #171616;background:url(images/headbg.png) 100%;height:1px;} - в Firefox линия отображается полностью черной. В других браузерах с "металлической прорезью".
Линия "проблемная" внизу сайта расположена над счетчиками посетителей - яндекса и mail.
Может версия браузера Firefox "старая" на моем компьютере 39.0 ...?
Если в Firefox увеличить страницу на 150% - именно тогда линия показана та которая и нужна )) в остальных случаях линия просто черного цвета.
Пробовал ( border-width: 1px 0 0 0; ) и ( border none; ) ничего не изменилось. Именно height:1px или height:2px изменяют линию.
У меня в стилях (style.css) линия hr прописана "дважды":
hr{border:solid #ddd;border-width:1px 0 0;clear:both;margin:10px 0 30px;height:0;}
hr{border-top:1px solid #171616;background:url(images/headbg.png) 100%;height:1px;}
такая запись дает нужный эффект линии во всех браузерах, кроме "мазилы". Для "мазилы" height:2px; тогда в других браузерах картинка PNG соответственно на 1 пиксель по высоте толще и нет того визуального эффекта - "прореза в самой линии hr".
Проблема следующая:
на сайте некорректно отображается линия именно в "мозиле", в других браузерах все идеально. Ниже приведен код CSS (CSS3) линии:
hr{border-top:1px solid #171616;background:url(images/headbg.png) 100%;height:1px;}
Для нормального отображения линии для браузера "МОЗИЛА" нужно прописывать высоту линии 2 px, для других браузеров высота линии 1 px. То есть если ставить высоту 2 пиксела, то в "мозиле" данная линия идеально отображается, а в остальных браузерах визуальный эффект уже не тот.
Не помогли ниже указанные коды:
hr{border-top:1px solid #171616;background:url(images/headbg.png) 100%;-moz-height:2px;}
или
hr{border-top:1px solid #171616;background:url(images/headbg.png) 100%;height:1px;-moz-height:2px;}
Прошу помочь, как правильно, точнее отдельно прописать СТИЛЬ для "мозилы" - height:2px? Именно в файле css (style.css).
PS В "мозиле" высота = 2px, в остальных браузерах высота = 1px.
…Страницы: 1