Как вы справляетесь с разным отображением размеров в ИЕ и ФФ?

wvxvw · 27.06.2008, 21:54

Собственно, интересует: padding в ФФ и ИЕ считается по-разному, мозила прибавляет его (зачем-то) к размерам, а ИЕ - нет. Хотелось бы раз и навсегда найти удовлетворительное решение, а то каждый раз для каждого конкретного случая по-новому изгалятся уже достало...

KidsKilla · 28.06.2008, 01:56

1) w3c-like. IE6+

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

2) IE5-like. no DOCTYPE. css:

Код:

box-sizing:border-box;-moz-box-sizing:border-box;

3) самый простой и надёжный:

Код:

<div style="width:300px;"><div style="padding:30px;"></div></div>

wvxvw · 28.06.2008, 19:37

пасиб =)
Хм... то есть нужно создавать 2 дива... млин... не хотелось бы, конечно... Ну если другого выхода нет.
Да, кстати, с этим не до конца разобрался:
какая из версий и каких браузеров понимает CSS стили объявленные так:
_width:
#width:
И связано ли это с DTD? Т.е. думал, может можно так сделать, чтобы ИЕ читал только свои стили, а ФФ свои?
И кто как расставляет приоритеты, если 2 класса присвоены один за другим типа:

Код:

class1 {width: 100px}
class2 {width: 200px}

Код:

<div class="class1 class2"></div>

Просто, ладно бы на странице было с десяток таких дивов, но их там до сотни, а то и больше должно быть. Взять и умножить на 2 не хочется...

Mnilionic · 28.06.2008, 21:46

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

лично использую:
доктайп

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

креплю основные стили,
а после них добавляю стили для ИЕ, кторые перекрывают свойства которые он врёт

Код:

<link rel="stylesheet" type="text/css" href="style1.css" />
<link rel="stylesheet" type="text/css" href="styleN.css" />
<!--[if lte IE 6.5]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->

wvxvw · 28.06.2008, 22:07

Я все равно страницу отдаю как text/html, так что XHTML не подходит... и... не знаю, я бы не был таким категоричным в отношении ИЕ =) Хотя, я даж не знаю, как по мне, что то, что другое - редкостный маразм, просто уклон у каждого специфический =) Пить теплую водку и закусывать зефиром по-моему и то приятнее, чем ваять ХТМЛ страницы =) Но похоже, что все этим и закончится - прийдется разные CSS делать для того и для другого =(

Mnilionic · 28.06.2008, 22:15

страница и должна быть text/html, другого я вам не предлагал.
Просто с таким доктайпом броузеры видут себя предсказуемо и практически одинакого.
Исключение лишь составляет ИЕ на некоторых моментах, для которых добовляем дополнительные стили. (такие как баги с флоатами с пинегами и пр.)

Может и с другими доктайпами есть совместивость, но я их не искал, так как этот вполне устраивает

wvxvw · 28.06.2008, 23:17

Не... у XHTML content-type = application/xml... И это... ничего себе исключение =) Как бы Мозилла ни старалась - ИЕ все-тки самый распространенный браузер =) так что в первую очередь надо на него ориентироваться =)
Если такой ДТД писать, а отдавать как текст - это все равно, что никакой ДТД не писать =)

Mnilionic · 29.06.2008, 00:09

я не буду с вами спорить или убеждать вас.
Я вам предложил вариант решения вашей проблемы.
Не желаете не далайте.

у xhtml контенттейп text/html - потому что это не xml а html написанный по синтаксису xml - не более того.

KidsKilla · 30.06.2008, 02:07

о. ещё один защитник xhtml =) вот: http://softwaremaniacs.org/blog/cate...xhtml-vs-html/

wvxvw, я подсказал два способа кроме удваивания элементов. выбирай любой -- лучше с докайпом (только не xhtml =)).
_width: #width: -- <=IE6
//width: -- <=IE7

class1 {width: 100px}
class2 {width: 200px}
<div class="class1 class2"></div>

сработает 2й. http://www.w3.org/TR/CSS21/cascade.html#specificity

Mnilionic · 30.06.2008, 03:38

о. ещё один любитель костылей...

я ничего не защищаю и не навязываю