Alim_(I)
Эксперт
Дата регистрации:
26.04.2011 14:55:07
Сообщений: 119
Почему у меня в браузере(Mozilla Firefox) выравнивает как попало этот HTML код:
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=windows-1251">
<link rel="stylesheet" type="text/css" href="style.css">
<title>Untitled Document</title>
</head>
<body>
<table width="100%" height="100%">
<tr>
<td><div class="topcontent">Top content</div></td>
</tr>
<tr>
<td colspan="2"><div class="leftcontent">Left content</div></td>
<td colspan="4"><div class="content">Content</div></td>
<td colspan="2"><div class="rightcontent">Right content</div></td>
</tr>
<tr>
<td colspan="3"><div class="bottomcontent">Bottom content</div></td>
</tr>
</table>
</body>
</html>
Файл style.css:
div.content {
width: 100%;
height: 100%;
margin-top: 4;
margin-left: 4;
margin-right: 4;
margin-bottom: 4;
border-middle: 0px;
}
div.leftcontent {
width: 100%;
height: 100%;
margin-top: 4;
margin-left: 4;
margin-right: 4;
margin-bottom: 4;
border-left: 0px;
text-valign: middle;
background-color: lightgray;
}
div.rightcontent {
width: 100%;
height: 100%;
margin-top: 4;
margin-left: 4;
margin-right: 4;
margin-bottom: 4;
text-valign: middle;
border:-right: 0px;
background-color: lightgray;
}
div.topcontent {
width: 100%;
height: 18%;
margin-top: 4;
margin-bottom: 4;
text-align: center;
text-valign: middle;
border-top: 0px;
background-color: cyan;
}
div.bottomcontent {
width: 100%;
height: 2%;
margin-bottom: 4;
margin-top: 4;
text-align: center;
text-valign: middle;
background-color: lightgray;
border-bottom: 2px;
}
Admin
Администратор
Дата регистрации:
27.05.2010 21:23:42
Сообщений: 3063
Свойств text-valign (надо использовать vertical-align) и border-middle (этого просто нет) не существует.
Alim_(I)
Эксперт
Дата регистрации:
26.04.2011 14:55:07
Сообщений: 119
Немного подправил все равно не получается:
div.content {
width: 100%;
height: 100%;
margin-top: 4;
margin-left: 4;
margin-right: 4;
margin-bottom: 4;
border: 0px;
}
div.leftcontent {
width: 100%;
height: 100%;
margin-top: 4;
margin-left: 4;
margin-right: 4;
margin-bottom: 4;
border: 0px;
vertical-align: middle;
background-color: lightgray;
}
div.rightcontent {
width: 100%;
height: 100%;
margin-top: 4;
margin-left: 4;
margin-right: 4;
margin-bottom: 4;
vertical-align: middle;
border: 0px;
background-color: lightgray;
}
div.topcontent {
width: 100%;
height: 18%;
margin-top: 4;
margin-bottom: 4;
text-align: center;
vertical-align: middle;
border: 0px;
background-color: cyan;
}
div.bottomcontent {
width: 100%;
height: 2%;
margin-bottom: 4;
margin-top: 4;
text-align: center;
vertical-align: middle;
background-color: lightgray;
border: 2px;
}
Admin
Администратор
Дата регистрации:
27.05.2010 21:23:42
Сообщений: 3063
И что здесь не устраивает?
Alim_(I)
Эксперт
Дата регистрации:
26.04.2011 14:55:07
Сообщений: 119
Тоже самое осталось, не изменилось вообще. Могу отправить файл(Test.html(Untitled Document)) по почте.
Admin
Администратор
Дата регистрации:
27.05.2010 21:23:42
Сообщений: 3063
Чего его отправлять? Я и так прекрасно вижу. Я спрашиваю: что здесь не устраивает?
Alim_(I)
Эксперт
Дата регистрации:
26.04.2011 14:55:07
Сообщений: 119
Нужно чтобы:
"topcontent" стоял вверху страницы, цвета океана, занимает 18% высоты страницы, и 100% ширины страницы.
"rightcontent" стоял вправом углу страницы светло-серого цвета, и занимал 18% ширины страницы, и 98% высоты страницы.
content" без перехода на новую строку белого цвета в середине страницы, занимал 64% ширины страницы, и 98% высоты страницы.
"leftcontent", тоже без перехода на новую строку светло-серого цвета в левом углу страницы занимал 18% ширины страницы и 98% высоты страницы.
И нижния секция "bottomcontent" серого цвета стояла внизу страницы не внутри нее был контент а после нее, и занимала 2% высоты страницы 100% ширины страницы.