Отцентровать содержимое по центру страницы (по высоте)

SCHNITZER · April 9, 2010

В итоге нужна небольшая таблица точно по середине окна браузера.

Делаю так:

<!В ТЕГ HEAD ПОМЕСТИТЬ СЛЕДУЮЩЕЕ:>

	<style type="text/css">

		.backbox

		 { 	position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		 }

	</style>


<body>
 <div class="backbox">

<table height="100%" align='center'> 

	<tr>
	<td>

	—  Page content  —

	</td>
	</tr>

</table>
</div>
</body>

Да вот в IE таблица (Page content) прилипает к верху окна браузера. Пытался просчитать высоту скриптом, не получается.

Помогите!

P.S. Еще интересно, чем плохо удалить "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">" ? Или "!" убрать... Так нет проблем...

Edited April 9, 2010 by SCHNITZER

Justnewone · April 9, 2010

почитайте про vertical-align

Searcher · April 9, 2010

P.S. Еще интересно, чем плохо удалить "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">" ? Или "!" убрать... Так нет проблем...

Раз понимания, что такое доктайп нету, то читаем еще и раздел Шаг за шагом, главным образом части про html и css.

stars · April 9, 2010

Ну собственно если это весь код страницы то он без грамотен как минемум... если это вырезка то я бы посоветовал добавить style="height:100%;" тегам html и body

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html style="height:100%;">
<head>
	<title>sity</title>
	<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
	<style type="text/css">
		.backbox {
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		}
	</style>
</head>
<body style="height:100%;">
<div class="backbox">
<table height="100%" align='center' > 
	<tr>
	<td>
	—  Page content  —
	</td>
	</tr>
</table>
</div>
</body>
</html>

единственное что не понятно для чего в нутри дива делать таблицу или зачем он собственно нужен тут )))

Edited April 9, 2010 by stars

SCHNITZER · April 9, 2010

to Justnewone: тут дело не в вертикальном выравнивании, а в 100% высоты. Как бы, выравнять относительно чего?

to Searcher: про !DOCTYPE шутка была, ну что же вы! )

to stars:

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

По поводу div - без него не получалось. Представленную идею я вычитал где-то, но она не работала в IE 6 вот только. А без div отцентрирования по вертикали не происходило.

А ВАША - РАБОТАЕТ! СПАСИБО!

Доработал код. Вот пример:

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

<html xmlns="http://www.w3.org/1999/xhtml"	lang="ru"	xml:lang="ru"	style="height:90%;	overflow: auto;">

<head>

	<title>Recontruction</title>

	<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
	<meta http-equiv="Content-Style-Type" content="text/css"/>
	<meta name="Resource-Type" content="Document" />

	<style type="text/css">

	</style>

</head>

<body style="height:90%;	background: #796f80;">

<table height="100%" 	align='center' 	style='font-family: comic sans ms; font-size: 20px; color: #ddd9b5;'>

	<tr	align='center'>
		<td>
			<p>Сайт на реконструкции.</p>
		</td>
	</tr>

</table>

</body>
</html>

Sign In

Отцентровать содержимое по центру страницы (по высоте)

Question

SCHNITZER

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

Justnewone

Link to comment

Share on other sites

Searcher

Link to comment

Share on other sites

stars

Link to comment

Share on other sites

SCHNITZER

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information