VPF::Баг в render'ре Firefox'а - Форум программистов

Royan

Дата 30.9.2007, 12:55 (ссылка)

(нет голосов)

Загрузка ...

Dreamer

Профиль
Группа: Участник Клуба
Сообщений: 1708
Регистрация: 14.9.2002
Где: Лондон

Репутация: нет
Всего: 15

Имеем код:

Код


<HTML>
  <HEAD>
  <STYLE type="text/css">
    LABEL {
        FLOAT: left;
        WIDTH: 150px;
        PADDING: 6px 10px 0px 0px;
        TEXT-ALIGN: right;
    }

    #fieldContainer {
        WIDTH: 350px;
        FONT-SIZE: 12px;
        BORDER: 1px solid #000;
    }

    #gray {
        WIDTH:200px;
        BACKGROUND-COLOR:#DDD;
    }
  </STYLE>
  </HEAD>
    <LABEL for="field">Lable text:</LABEL>
    <DIV id="fieldContainer">
        <INPUT id="field" name="some" class="txtField" type="text" maxLength="128"/>
        <DIV id="gray">Этот текст под должен быть под полем</DIV>
    </DIV>
</HTML>

В Firefox'е рамкой обводится элемент LABEL, в то время как он вовсе не находится внутри DIV'а. Из-за этой фичи/бага Firefox'а DIV#gray съезжает влево (вместе с текстом соответственно). В Opera и IE все нормально. Кто нибудь знает как с этим бороться, средствами CSS/HTML?

--------------------

Открыта вакансия Junior Java Developer'а в нашем лондонском офисе, подробнее можно узнать здесь

comcon1

Дата 30.9.2007, 13:06 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 838
Регистрация: 11.6.2005
Где: Москва ДАС-МГУ

Репутация: нет
Всего: 17

чтобы лабел обводился рамкой, тока когда он внутри дива, нужно писать так:

Код


DIV    LABEL {

А в чем собственно баг, я не понимаю?

--------------------

comcon1 on twitter

Royan

Дата 30.9.2007, 14:06 (ссылка)

(нет голосов)

Загрузка ...

Dreamer

Профиль
Группа: Участник Клуба
Сообщений: 1708
Регистрация: 14.9.2002
Где: Лондон

Репутация: нет
Всего: 15

comcon1,

Запустите приведенный код в Firefox, Opera и IE. Разница будет очевидна, при этом баг только в Firefox'e.
Если внимательно посмотреть на код, то будет видно, что рамка (BORDER) в таблице стилей описана только для DIV'а, а в Firefox'е на почемуто появляется еще и вокруг LABLE'а

--------------------

Открыта вакансия Junior Java Developer'а в нашем лондонском офисе, подробнее можно узнать здесь

Illuminaty

Дата 30.9.2007, 14:50 (ссылка)

(нет голосов)

Загрузка ...

/*Антон Захаров*/

Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56

У меня складывается впечатление, что в приведенном ниже коде проблема решена. Или я не прав?

Код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Проверка</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<STYLE type="text/css">
    LABEL {
        FLOAT: left;
        WIDTH: 150px;
        PADDING: 6px 10px 0px 0px;
        TEXT-ALIGN: right;
                display: block;
    }
    #fieldContainer {
        WIDTH: 350px;
        FONT-SIZE: 12px;
        BORDER: 1px solid #000;
                float: left;
    }
    #gray {
        WIDTH:200px;
        BACKGROUND-COLOR:#DDD;
    }
  </STYLE>
</HEAD>
<body> 
<LABEL for="field">Lable text:</LABEL> 
<DIV id="fieldContainer"> 
        <INPUT id="field" name="some" class="txtField" type="text" maxLength="128"/> 
        <DIV id="gray">Этот текст под должен быть под полем</DIV> 
</DIV> 
</body>
</html>

Баг тут следует искать не в браузере smile

comcon1

Дата 30.9.2007, 16:15 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 838
Регистрация: 11.6.2005
Где: Москва ДАС-МГУ

Репутация: нет
Всего: 17

сорри. увидел. внатуре лабл притягивается в ДИВ))) вот в таком случае не притягивается:

Код


    <LABEL for="field">Lable text:</LABEL>
    <table><tr><td id="fieldContainer">
        <INPUT id="field" name="some" class="txtField" type="text" maxLength="128"/>
        <DIV id="gray">Этот текст под должен быть под полем</DIV>
    </table>

Но Illuminaty, конечно +1.

--------------------

comcon1 on twitter

Royan

Дата 30.9.2007, 16:22 (ссылка)

(нет голосов)

Загрузка ...

Dreamer

Профиль
Группа: Участник Клуба
Сообщений: 1708
Регистрация: 14.9.2002
Где: Лондон

Репутация: нет
Всего: 15

Illuminaty, Даа мастер! Тебе плюс smile

Признаюсь я прежде чем задать вопрос поиграл и с DOCTYPE'ами и даже проставлял display:block'и в разных местах, но не догадался про float: left.

Все же отличное от Opera поведение стилей в Firefox'e случается гораздо реже, чем между этой парочкой и IE

--------------------

Открыта вакансия Junior Java Developer'а в нашем лондонском офисе, подробнее можно узнать здесь

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »