Параметр height100% + IE+doctype

Alexwweb · March 27, 2008

Добрый день! У меня проблемка вот в чем (по форуму искал, 100% решения не нашел):

Сама страница

<html>
<head>
<title>homepage</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<table class="main" height="100%" border="0" cellpadding="0" cellspacing="0">
 <tr>
 <td class="leftcolumn" rowspan="6"></td>
 <td class="rightcolumn" colspan="7"> </td>
 <td class="top" rowspan="6"> </td>
 </tr>

 <tr>
 <td colspan="2">
 <a href="#"><img src="images/homepage_04.jpg" alt="subsribe.direct" width="225" height="26" border="0"></a></td>
 <td class="toptext" colspan="5">скрыть информацию</td>
 </tr>
 <tr>
 <td>
 <img src="images/homepage_06.jpg" width="10" height="185" alt="img"></td>
 <td class="login" colspan="2">текст</td>

 <td>
 <img src="images/homepage_08.jpg" width="13" height="185" alt="img"></td> 
 <td colspan="3">
 <div align="right"><img src="images/homepage_10.jpg" alt="flag subscribe"></div></td>
 </tr>
 <tr> <td class="center" colspan="7"><h1>Как это работает?</h1>
 <p>В процессе работы с информационным каналом Subscribe.Direct наши пользователи 

 сообщают нам о своих интересах и предпочтениях.

 Это позволяет нам размещать рекламу максимально прицельно - с учетом географии 

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

 виды предложений.</p>
 <p>Ваши рекламные объявления размещаются в тематическом контексте, соответствующем 

 объявлению:</p>
 <p> в соответствующих выпусках новостных каналов, получаемых подписчиками нашего сайта

 на соответствующих тематических страницах нашего сайта

 в результатах поиска, соответствующих выбранным вами ключевым словам</p>
 <p>Данная технология была опробована нами на тысячах проведенных рекламных кампаний.

 Накопленный опыт позволяет вам размещать рекламу с оплатой "за результат". </p></td>

 </tr>
 <tr>
 <td>
 <img src="images/homepage_11.jpg" width="10" height="33" alt="img"></td>
 <td class="bottommenu" colspan="4">О компании | Пресса о нас | Пресс-релизы | Обратная связь | Помощь</td>
 <td><img src="images/homepage_13.jpg" width="10" height="33" alt="img"></td>
 </tr>
<tr>
 <td class="top" colspan="7"> </td>
 </tr>
 <tr>
 <td>
 <img src="images/spacer.gif" width="51" height="1" alt=""></td>
 <td>
 <img src="images/spacer.gif" width="10" height="1" alt=""></td>
 <td>
 <img src="images/spacer.gif" width="215" height="1" alt=""></td>
 <td>
 <img src="images/spacer.gif" width="317" height="1" alt=""></td>
 <td>
 <img src="images/spacer.gif" width="13" height="1" alt=""></td>
 <td>
 <img src="images/spacer.gif" width="438" height="1" alt=""></td>
 <td>
 <img src="images/spacer.gif" width="10" height="1" alt=""></td>
 <td>
 <img src="images/spacer.gif" width="42" height="1" alt=""></td>
 <td>
 <img src="images/spacer.gif" width="46" height="1" alt=""></td>
 </tr>
</table>
</body>
</html>

CSs файл

body, input, select, textarea { /* фон, цвет фона ячеек*/
 background-color: #ffffff;
}
td, input, select, textarea { /* Текст во всех ячейках, параметры*/
 font-family: Tahoma;
 font-size: 11px;
 color: #000000;
 vertical-align: top; 
}
html, body { /* отступы от краев экрана и внутри межу ячейками таблиц*/
 margin:0px;
 padding:0px;
}
h2, h1, h3{margin:0 0 5px 0;} /* параметры заголовков*/
a {color:#284250;}

table.main { /* параметры всей разметки таблицы, зазоры между ячейками*/
 border-collapse: collapse;
 width: 100%;
 height: 100%;
}
td { /* отступы в ячейках таблицы*/
 padding: 0px;
} 
td.toptext { /* Текст на флагом, параметры*/
 font-family: Tahoma;
 font-size: 11px;
 color: #000000;
 vertical-align: bottom;
 text-align:right;
}
.toptext{color:black;margin-top:15px; text-decoration:underline; } /* Текст на флагом, параметры ссылок*/
.toptext a{color:black;} /* Текст на флагом, параметры ссылок при наведении*/

td.leftcolumn { /* колонка отступа от экрана слева*/
width:10px;
}
td.rightcolumn { /* колонка отступа от экрана справа*/
width:10px;
}
td.top { /* колонка низ и верх*/
height:10px;
}
td.bottommenu { /* параметры нижнего меню*/
background-color:#EBF0F2;
height:33px;
width:100%;
font-family:"Times New Roman", Times, serif;
font-size:12px;
color: #284250;
vertical-align:middle;
text-align:center;
text-decoration:underline;
}
.bottommenu{color:#284250;} /*Цвет ссылок, нижнее меню*/
.bottommenu a{color:#284250;} /* цвет ссылок нижнее меню при наведении*/

td.login { /* параметры блока логин*/
background-image:url(images/homepage_077.jpg);
background-repeat:repeat-x;
height:185px;
width:100%;
}
.login{ /* параметры текста блока логин*/
text-align:justify;padding:6px;color:#284250;
}
td.center { /* параметры центральной ячейки*/
height:100%;
color:#284250;
}
.center{ /* параметры текста центральной ячейки*/
text-align:justify;padding:6px;color:#284250;
}

quot;-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

При вставке doctype валидность 100%, но есть одно НО! В IE не растягивается таблица на 100% по высоте. Как решить? Всем спасибо!

Dimitry Wolotko · March 27, 2008

Какое IE? И локализуйте таки проблему.

Alexwweb · March 27, 2008

Какое IE? И локализуйте таки проблему.

При вставке doctype валидность 100%, но есть одно НО! В Internet Explorer 7 не растягивается таблица на 100% по высоте. Как решить? Всем спасибо!

homm · March 27, 2008

При вставке doctype валидность 100%, но есть одно НО! В IE не растягивается таблица на 100% по высоте. Как решить? Всем спасибо!

И не должна, судя по приведенному коду.

Константин · March 27, 2008

Попробуй из доктайпа убрать строчку "http://www.w3.org/TR/html4/loose.dtd", т.е. оставить только quot;-//W3C//DTD HTML 4.01 Transitional//EN">

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

P.S. В ие6 нормально вс? тянется

homm · March 27, 2008

Как решить? Всем спасибо!

Написать правильно. Про то, что ты ?по форуму искал? ? врешь.

Alexwweb · March 27, 2008

Как решить? Всем спасибо!
Написать правильно. Про то, что ты ?по форуму искал? ? врешь.

Что написать правильно? и почему по приведенному коду не будет тянуться?

По форуму я искал,

http://forum.htmlbook.ru/viewtopic.php?pid=50385

http://www.htmlbook.ru/content/?id=92&text=1

и т.д.

Я ценю время других и свое, если не нашел, значит спросил, так бы и не спрашивал. Спасибо

Alexwweb · March 27, 2008

Попробуй из доктайпа убрать строчку "http://www.w3.org/TR/html4/loose.dtd", т.е. оставить только quot;-//W3C//DTD HTML 4.01 Transitional//EN">
Это конечно немного неправильно, но валидатор ругаться не будет.
P.S. В ие6 нормально вс? тянется

Превесьма благодарен, вопрос решен.

Топик можно закрывать

homm · March 27, 2008

и почему по приведенному коду не будет тянуться?

Потому что элемент table находится в элементе body, а элемент body в элементе html. Твой код будет работать только в совместимом режиме, как ты и поставил, но верстать в таком режиме, мягко говоря, проблематично. Впрочем, многие не разделяют этого мнения и верстают в нем.

Sign In

Параметр height100% + IE+doctype

Question

Alexwweb

Link to comment

Share on other sites

8 answers to this question

Recommended Posts

Dimitry Wolotko

Link to comment

Share on other sites

Alexwweb

Link to comment

Share on other sites

homm

Link to comment

Share on other sites

Константин

Link to comment

Share on other sites

homm

Link to comment

Share on other sites

Alexwweb

Link to comment

Share on other sites

Alexwweb

Link to comment

Share on other sites

homm

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information