ТвойWeb :: Версия для печати :: Совместимость div с IE и Mozilla

1. Antonio - 04 Июля, 2006 - 18:53:59 - перейти к сообщению

Народ подскажите как подогнать под Firefox вот это:

CODE:

<html>
<head>
<title></title>
<style>
a:link {
font-family: Tahoma;
font-size: 12px;
font-weight: normal;
color: #16285C;
text-decoration: none;
}
a:hover {
font-family: Tahoma;
font-size: 12px;
font-weight:narmal;
color: #16285C;
TEXT-DECORATION: underline;
}
a:visited {
font-family: Tahoma;
font-size: 12px;
font-weight: normal;
color: #16285C;
text-decoration: none;
}
.a {
width: 100%;
height :100%;
}
.b {
width: 880px;
height: 100%;
border-left: 1px solid #AFB8D6;
border-right: 1px solid #AFB8D6;
border-top: 1px solid #AFB8D6;
border-bottom: 1px solid #AFB8D6;
background-color: #E7EAF5;
padding-top: 2px;
}
.c {
width: 874;
height: 10px;
font-size: 0px;
line-height: 0px;
border-bottom: 1px solid #AFB8D6;
border-top: 1px solid #AFB8D6;
border-left: 1px solid #AFB8D6;
border-right: 1px solid #AFB8D6;
}
.d {
width: 874;
height: 80px;
border-left: 1px solid #AFB8D6;
border-right: 1px solid #AFB8D6;
}
.e {
width: 200px;
height: 80px;
display: inline;
}
.f {
width: 660px;
height: 80px;
display: inline;
padding-top: 8px;
}
.g {
width: 468px;
height: 60px;
border-left: 1px solid #AFB8D6;
border-right: 1px solid #AFB8D6;
border-top: 1px solid #AFB8D6;
border-bottom: 1px solid #AFB8D6;
background-color: #E7EAF5;
padding-top: 23px;
font-family: Tahoma;
font-size: 12px;
color: #16285C;
}
</style>
</head>
<body>
<div class="a" align="center">
<div class="b">
<div class="c"></div>
<div class="d">
<div class="e"><a href="#"><img src="#" height="80" width="200" alt="#" border="0"></a></div>
<div class="f">
<div class="g" onmouseover="this.style.background='D8DCEE'" onmouseout="this.style.background='E7EAF5'" style="cursor: hand">468 x 60 px</div>
</div>
</div>
<div class="c"></div>
</div>
</div>

</body>
</html>

В IE все как и должно быть, в Фоксе совсем другое, как сделать чтобы и там и там все отображалось одинаково?

2. Ray Wen - 04 Июля, 2006 - 22:33:02 - перейти к сообщению

Поставь в самом верху вот это:

CODE:

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

Скорее всего FF принудительно использует последнюю спецификацию, а IE если не указано, то работает как прийдется...

3. Antonio - 05 Июля, 2006 - 05:56:38 - перейти к сообщению

Ray Wen
После вставки строки стало одинаково неправильно отображаться как в IE так и в FF.

4. Ray Wen - 05 Июля, 2006 - 06:45:07 - перейти к сообщению

Antonio
Не "не правильно", а так как должно быть... и то что одинакого отображается, уже один большой плюс... Просто по новой спецификации padding не зависит от width и height, тобишь ширина и высота "рабочего" пространства остается такой же, какая она указана, а padding идет в плюс...

5. Antonio - 05 Июля, 2006 - 10:24:49 - перейти к сообщению

Ray Wen
Так значит, мне нужно вставить эту строчку и подгонять диз?

6. Ray Wen - 05 Июля, 2006 - 13:13:27 - перейти к сообщению

Antonio
Отминусуй от высоты паддинг по вертикали и от ширины по горизонтали... Это всего лишь дело привычки, потом поймешь что даже удобнее таким образом делать...

7. Antonio - 08 Июля, 2006 - 11:26:56 - перейти к сообщению

Ray Wen
Все сделал, в IE и Foxe показывает как задумано, зато в опере все уехало за левый край.

CODE:

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

</style>
</head>
<body topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0" background="#">
<div class="a" align="center">
<div class="b">
<div class="c"></div>
<div class="d">
<div class="e"><img src="#" height="80" width="200" alt="#" border="0"></div>
<div class="f">
<div class="g"></div>
</div>
</div>
<div class="c"></div>
</div>
</div>

</body>
</html>

Вот код, что не правильно делаю?

8. Ray Wen - 08 Июля, 2006 - 13:03:56 - перейти к сообщению

Antonio
А нафига заморочки с абсолютным позиционированием? Причем последующим выравниванием маргинами... не проще ли тогда указать координаты?

9. Antonio - 09 Июля, 2006 - 04:53:22 - перейти к сообщению

Ray Wen
Ладно, попробую, посмотрим что получится.

10. Antonio - 09 Июля, 2006 - 06:21:13 - перейти к сообщению

Ray Wen
Подскажи, как координатами выравнить, неполучается правильно.