В ие все в норме а в остальные меня не любят

**Cheese** · 26.09.2007, 15:24

Есть такой шаблон:

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
****"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
****<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
****<title></title>
</head>
<style type="text/css">
body{****
****width:100%;
****height: 100%;
****margin-left: 0px;
****margin-top: 0px;}
/******HEADER***********/
.header
{****background: url(../im/hed_r.jpg) no-repeat top right;
****font-family: Arial, Helvetica, sans-serif;
****vertical-align: top;
****width: 100%;
****height: 275px;
****display: block;}
/********Блок навигационного меню***********************************/
.dmenu {****width: 300px;
****height: auto;
****vertical-align: top;
****float: left;
****background-color: #32CD32;}
/******Контейнер для FrauxColumns**********************/
.contbdy
{
background: *url(../im/razd.jpg) repeat-y top left;****
vertical-align: top;
display: block;
width: 100%;
height: auto;
background-color: #80ff00;
}
/****Блок контента***************************************************/
.scont {
****font-family: Arial, Helvetica, sans-serif;
****font-size: 13pt;
****text-align: justify;
****vertical-align: top;
****height: auto;
****padding-left: 20px;
****padding-right: 10px;
****display: block;
****margin-left: 300px;
****overflow: hidden;
****background-color: #ff66ff;
}
.blt
{
****display: block;
****width: 656px;
****height: 250px;
****vertical-align: top;
****float: none;
****background-color: #ffffcc;
}
.mblock1
{
****width: 190px;
****height: 680;
****vertical-align: top;
****padding-left: 20px;
****padding-right: 20px;
****float: left;
****background-color: #333399;
}
</style>
<body>

<div class="contbdy">
<div class="dmenu" >
Тут навигация
</div>
<div class="scont">
<div class="blt" align="right">
****Тут несколько дивов со всякой фигней
</div>
<div class="mblock1">
Тут полоса с картинками
</div>
<div align="justify" class="content">
Тут типа контент
</div></div></div></div>
</body>
</html>

С ИЕ этот шаблон дружит а вот нормальные браузеры его уродуют как бог черепаху. Вроде бы все с ним в порядке...Непонимаю... Может кто подскажет что же все-таки не правильно?
...Хоть и выкинул все лишнее всеравно много букв получилось

**Aykroyd** · 26.09.2007, 15:40

Подход неправильный. Необходимо делать все наоборот. Сначала добиваемся, чтобы во всех нормальных браузерах было все в норме, а вот потом начинаем разбираться с IE и задаем вопросы...

**Cheese** · 26.09.2007, 18:36

Originally posted by Aykroyd@Sep 26 2007, 13:40
Подход неправильный....
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]
Хорошо, меняем подход....
Тот же шаблон только

Код:

body{****width:1000px;
****height: 100%;
****min-height: 100%;
****min-width: 1000px;
****margin-left: 0px;
****margin-top: 0px;}
.header
{****background: url(../im/hed_r.jpg) no-repeat top right;
****font-family: Arial, Helvetica, sans-serif;
****vertical-align: top;
****width: 100%;
****height: 275px;
****display: block;}

.dmenu {****width: 300px;
****height: 100%;
****vertical-align: top;
****float: left;
 background-color: #32CD32;}
.contbdy
{
background-color: #80ff00;
vertical-align: top;
display: block;
width: 1000px;
height: auto;
overflow: hidden;
}
.scont {
****font-family: Arial, Helvetica, sans-serif;
****font-size: 13pt;
****text-align: justify;
****vertical-align: top;
****height: auto;
****padding-left: 20px;
****padding-right: 10px;
****display: block;
****overflow: hidden;
****width:auto;
 background-color: #ff66ff;
}
.blt
{
display: block;
width: 656px;
height: 250px;
vertical-align: top;
 background-color: #ffffcc;
}
.mblock1
{
****width: 190px;
****height: 680;
****vertical-align: top;
****padding-left: 20px;
****padding-right: 20px;
****float: right; background-color: #333399;
}

в нормальных браузерах отображается корректно а ИЕ в некоторых случаях
содержимое .scont прижимается к левой границе окна после того как заканчивается содержимое .dmenu...
... Так хочется вернуться к абсолютному позиционированию....

**Aykroyd** · 26.09.2007, 18:47

А ниче, что один закрывающий див – лишний? )

Посмотрел я Ваш код...
Простите, Вы хоть сами-то понимаете, что Вы пишете?

Задаете одновременно ширину и высоту в совокупности с минимальной шириной и высотой... Не обнуляете отступы у body... vertical-align: top; в блочных элементах – это для чего? display: block; для блочных элементов – это зачем? height: auto; для блока в прямом потоке, для которого и так height: auto; по умолчанию...

.dmenu: {height: 100%;} – это 100% от чего? Извините, родитель данного элемента не имеет явной высоты...

Размер шрифта в пунктах обычно только для печати задается...

.mblock1 {height: 680;} – 680 чего? килограмм?

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

в нормальных браузерах отображается корректно а ИЕ в некоторых случаях
содержимое .scont прижимается к левой границе окна после того как заканчивается содержимое .dmenu...

Проблема в IE от того, что для блока .scont не включено специфическое свойство [Только зарегистрированные пользователи могут видеть ссылки. ]... Его можно включить, например, следующим методом: * html .scont {height: 1%;}...

**Cheese** · 27.09.2007, 11:59

Originally posted by Aykroyd+Sep 26 2007, 16:47--><div class='quotetop'>Цитата(Aykroyd @ Sep 26 2007, 16:47)</div>

А ниче, что один закрывающий див – лишний? )[/b]

Не страшно. Он наверное приблудился когда я убирал из странички лишнее...

<!--QuoteBegin-Aykroyd@Sep 26 2007, 16:47
Посмотрел я Ваш код...
Простите, Вы хоть сами-то понимаете, что Вы пишете?

С трудом

Originally posted by Aykroyd@Sep 26 2007, 16:47
Задаете одновременно ширину и высоту в совокупности с минимальной шириной и высотой... Не обнуляете отступы у body... vertical-align: top; в блочных элементах – это для чего? display: block; для блочных элементов – это зачем? height: auto; для блока в прямом потоке, для которого и так height: auto; по умолчанию...
.dmenu: {height: 100%;} – это 100% от чего? Извините, родитель данного элемента не имеет явной высоты...

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

Originally posted by Aykroyd+Sep 26 2007, 16:47--><div class='quotetop'>Цитата(Aykroyd @ Sep 26 2007, 16:47)</div>

Размер шрифта в пунктах обычно только для печати задается...[/b]

Не знал... по-моему где-то у Темы встречал фразу, что задавать шрифт в пикселах - дурной тон... хотя могу и ошибаться

Originally posted by Aykroyd@Sep 26 2007, 16:47
.mblock1 {height: 680;} – 680 чего? килограмм?

Ну тут откровенный ляп...

<!--QuoteBegin-Aykroyd@Sep 26 2007, 16:47
грязь, в общем...
честно говоря, даже не понятна суть такой раскладки...

А чего непонятного? Раскладка в две колонки с хидером, причем правая колонка
раскладывается еще на две но не с самого начала... Возможно ваш трехколоночный шаблон из прикрепленной выше ветки более совершенен, но он меня пугает использованием js для борьбы с min-... в IE, поэтому рисовал сам как умею, а умею плохо

Originally posted by Aykroyd@Sep 26 2007, 16:47
Проблема в IE от того, что для блока .scont не включено специфическое свойство [Только зарегистрированные пользователи могут видеть ссылки. ]... Его можно включить, например, следующим методом: * html .scont {height: 1%;}...
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]

Снимаю шляпу....

**Aykroyd** · 27.09.2007, 16:01

Originally posted by Cheese@Sep 27 2007, 11:59
Не знал... по-моему где-то у Темы встречал фразу, что задавать шрифт в пикселах - дурной тон... хотя могу и ошибаться
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]
Правильно. Задавать надо в процентах и em-ах...
[Только зарегистрированные пользователи могут видеть ссылки. ]

Originally posted by Cheese+Sep 27 2007, 11:59--><div class='quotetop'>Цитата(Cheese @ Sep 27 2007, 11:59)</div>

Раскладка в две колонки с хидером, причем правая колонка
раскладывается еще на две но не с самого начала...[/b]

Такими методами раскладка в две колонки не делается...
Обычно левая колонка флоатится налево, а правая – направо...
Тогда и хаков для IE6 практически не понадобится...

<!--QuoteBegin-Cheese@Sep 27 2007, 11:59
Возможно ваш трехколоночный шаблон из прикрепленной выше ветки более совершенен, но он меня пугает использованием js* для борьбы с min-... в IE,
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]
JS тут ни при чем...
Он в любом случае понадобится, если сайт "резиновый"...
Какими бы блочными методами он не верстался...

Тема: В ие все в норме а в остальные меня не любят

Опции темы

Поиск по теме

Отображение

Похожие темы

Главная страница и остальные

почему заказкики не любят Dreamweaver?

Поздравьте меня

Успокойте меня :)

теперь у меня тож есь жж)

Ваши права