укладка hr-tag, неясное наследие? - PullRequest
0 голосов
/ 10 апреля 2011

Я обычно использую это, чтобы получить разделительную строку в один пиксель между абзацами

    <style>
    .narrow_red_hr {color:  #ffa0a0;  background: #ffffff;  border-left-style:none;  height: 1px;}
    .hr3 {
    margin: 10px 0px 10px 0px;
    height: 1px;
    background: #00ff00;
    width: 100%;
    font-size: 1px; /* IE 6 */
    }
    </style>
    <script type="text/javascript">
    function separator(){
    if (BrowserDetect.browser == "Explorer"){
    document.write('<hr class="narrow_red_hr">');
    } else {
    document.write('<div class=hr3></div>');
    }
    }
    </script>

Обычно получается так, как я хочу, вот так: http://e -dog.info / TMP / correct.bmp

На одной странице это выглядит примерно так в IE: http://e -dog.info / TMP / unwanted.bmp

Он должен быть красного цвета и иметь высоту один пиксель, но здесь, в IE, он выглядит серым и имеет нежелательный левый край (около 1 пикселя в высоту) серого цвета. (Этот стиль выполнен только в IE-браузере)

Я не очень хорош с наследованием CSS и тем, как более ранние объявления стилей могут повлиять позже. Есть несколько предыдущих таблиц стилей, я прочитал их и не могу найти никакого объявления для тега hr. Я предполагаю, что тег hr как-то унаследовал свойство. (Он серый, как окружающий текст?)

Как мне решить эту проблему?

Я хочу удалить тег hr из всех предыдущих объявлений стилей или перезаписать объявление с неправильным цветом и нежелательным левым полем. (Вот почему я попытался дать ему фон #ffffff, f.ex.)

Я очень благодарен за любую помощь, хотя я не в поездке, и может пройти некоторое время, прежде чем я смогу ответить. Я определенно буду благодарен за все советы, спасибо. : -)

1 Ответ

0 голосов
/ 11 апреля 2011

Как видно из комментариев к первому посту, ответы Джейми Диксона и Ксавье Холта содержат ответ на вопрос, спасибо ребята. Использование свойства border-top (или bottom) лучше, чем использование всего div, как CSS, который я имел в своем первом посте.

Горизонтальная линия X-браузера высотой 1px (например, для разделения абзацев) может быть получена:

<div style="border-top: solid 1px #ffa0a0; margin: 10px 0px 6px 0px;"></div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...