Заметки веб-мастера

Виртуално-реальная жизнь

Рисование тонкой линии

Written By: Virus - Окт• 25•09

Суть задачи такова: нарисовать на сайте тонкую линию. Решается она  минимум 2 методами:

  1. Использование однопиксельного изображения размноженного в нужном направлении.
  2. Использование div’a, заполненного цветом.

Как раз во втором методе и скрываются разногласия между браузерами.

Итак, объясню на примере.

Допустим мы рисуем полосу div’ами и задаем ей следующие css-свойства:

div {
width:50px;
height:1px;
background-color:#ff0000;
}

Mozilla, Opera и другие браузеры будут выдавать следующий результат:

линия в Mozilla, Opera и др.

а вот IE выдаст толстую полосу:

линия в IE

Суть этого «бага» заключается в том, что IE по умолчанию выставляет ширину блока под размер шрифта (по моим наблюдениям 14px), т.е. для того что бы Internet Explorer нормально отображал однопиксельную полоску, необходимо в css-свойства блока добавить font-size:1px;

P.S. Еще интересуют дома в Болгарии, но походу до них мну ооочень далеко )

You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

One Comment

  1. z0r:

    Ну какбы ещё можно через и бордером верхнего/нижнего дива

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

*

*

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>