Pokidov Dmitriy

Fucking div in fucking IE

Wednesday, 23. April 2008, 07:42:18

Сверстал я значит html. Все уже было готово и дело дошло до тестирования. Я конечно ждал всяких гадостей от "моего самого любимого браузера Internet Explorer 6", но чтобы на это убить 2 часа!!!! Отладка была затруднена тем что все писалось на gwt и фактически самого хтмля я не видел, а анализировал все только через инспектор DOM(кстати поиск бесплатного инспектора для IE это тоже отдельная история). В итоге все было разобрано по частям в течении полутора часов и получилась всего одна строчка:

<div style="width: 100%; height: 2px; background-color: red"></div>

. Что мы видим в IE??? Мы видим толстую линию не как ни в 2 пикселя. ШЕФ, ВСЕ ПРОПАЛО!!!! но не тут то было

Русских так просто не взять, после этого я сделал div не пустым и выяснил что высота div - это высота шрифта, после этого решение пришло:

<div style="width: 100%; height: 2px; background-color: red; font-size: 1px"></div>

ТАРАМ!!!
Всё, работает.

Hello world!!!!Ошибка которой 25 лет

Comments

PostmanPechkin # 24. April 2008, 05:04

Чорт, мало что понял, но всё равно завидно!

html-coder # 24. April 2008, 19:08

Совершенно неправильная реализация.
Чтобы сделать полоску надо пользоваться или <hr> или задавать border для дива. А сам див ни в коем случае не оставлять пустым, а заполнять кодом пробела  .

Инспектор для ИЕ есть, но я бы не сказал, что это верх удобства. Лучше пользоваться файрбагом.

dooman # 24. April 2008, 19:26

Ну для меня это было поучительно в связи с тем что в gwt есть виджет под названием HTML. Собственно наверно в начале надо было упоминуть что данный виджет обрамляет содержимое в

<div>

Т.е.


HTML widget = new HTML("<hr>");

сгенерирует ДОМ следующего вида:


<div><hr></div>

Ну и кстати, не надо забывать что есть еще вертикальные линии, с ними были другого рода траблы в ИЕ. По поводу пробела в диве, я тоже удивился хинту типа:

<div></div>

- дива нет, зато:

<div><!-- --></div>

- див есть

html-coder # 24. April 2008, 19:48

Вертикальные линии я задаю только через border.
А див с комментарием - все же не лучший вариант. Пробел удобнее. Только пробел обязательно должен быть как спецсимвол -  

alen4ik # 4. May 2008, 20:40

хи хи )))) надо ж сколько разных способов))) можно еще вырезать из бумаги и прилепить к монитору... но это тоже будет совсершенно неправильная реализаия)))
dooman учись пока тебе советуют)))

html-coder # 5. May 2008, 05:04

Учиться никогда не поздно и никому не вредно.

g00r00 # 13. May 2008, 08:39

Кстати, ещё помогает использование доктайпа. Например, я открыл DW, сказал сделать сгенерить HTML, потом вставил туда твой первоначальный код, в итоге:


<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
    <div ></div>
</body>
</html>

и в итоге - полоса высотой 2px в IE, правда в 7-ом, в 6-ом счас не могу проверить, но по логике первоначальный также вариант не работал в IE7.

P.S.: почему то в блоке кода пропал аттибут style у div'a, подскажите pls как правильно завернуть код?

html-coder # 13. May 2008, 09:19

Правильно стили делать отдельным файлом

g00r00 # 13. May 2008, 10:04

Не совсем так. Стиль надо делать отдельным файлом только если он используется на нескольких страницах, если же стиль используется на одной странице, то он может быть встроенным в код, но крайне желательно делать это в секции <head>
Ну а инлайновый стиль это конечно неправильно, но я написал как у автора, чтобы было с минимальными изменениями, а вообще, это же тестовый пример, тут не обязательно делать правильно, главное показать технологию.
И наконец, я имел ввиду именно здесь в комменте в секции кода пропадает кусок текста.

Anonymous # 15. May 2009, 13:37

Аноним writes:

HR В опере не имеет цветов, потому для полосок надо юзать див :)

Write a comment

Blog search

Download Opera, the fastest and most secure browser

Latest comments

Jajatips

Good examples of Java EE patterns.
Good Day. In the last message from SDN, I received information about "Java EE Patterns and Best Practices Project". That is excellent idea, with excellent realization. I recommend to all developers that use Java EE to see this examples. To get it, you should have mercurial and checkout repository, ...
Write compressing rolling file appender for log4j
Good day! On the last week, we gave our software to support specialists. They installed the program to production servers. And over three thousand users began to work with it. At the on of that week, I didn't hear nothing about our product. This is good the good sign! :) But, we have one little pro ...
Increase perfomance for insert operations to datab ...
Hi all!In this post, I would like to tell about the way to optimize INSERT operation to database. In our project we use postgresql 8.3. I have big problems with speed on some operations. When I profiled the application, I find out that the biggest amount of time spent for JDBC operations. We getting ...
Create hyperlink with browsing support.
test syntax highlighter for blogger