Div в центре внимания

  • Автор темы _NOOB
  • Дата начала
Статус
Закрыто для дальнейших ответов.
N

_NOOB

Всем привет. Понимаю что вопрос гдупый, но я совсем запутался, недавно начал, не судите строго))

Нужно поместить ДИВ в центр страничке, на ней больше ничего нет, делаю так
Код: 
<html>
<head>
<title>DIV</title>
<style>
div {text-align:center; vertical-align:middle;}
</style>
</head>
<body bgcolor=lightgreen>
<div>ЦЕНТР ВСЕГО!!!</div>
</body>
</html>

А позиционирует только по центру по горизонтали, по вертикали менять не хочет, как это сделать??
Заранее спасибо =)
 
N

_NOOB

2sax_ol Наверное забыл сказать лопата =)

Есть еще варианты?
up
 
G

garrymax

Не понимает DIV вертикальной позиции, если не задан парметр position: absolute; и top со значением расчета "высота видимой области" / 2 - "высота самого DIV" / 2 (скриптом надо позицировать).

Проще воспользоваться таблицей:
Код: 
<TABLE width=100% height=100%>
<TR><TD width="25%"> </TD><TD width="50%"> </TD><TD width="25%"> </TD></TR>
<TR><TD></TD><TD><center>ЦЕНТР ВСЕГО!!!</center></TD><TD></TD></TR>
<TR><TD></TD><TD></TD><TD></TD></TR><TABLE>
 
D

Dmirys

А зачем столько всего? Может просто написать:

Код: 
<table width="100%" height="100%"><tr><td align="center" valign="middle">Центр</td></tr></table>

А про позиционирование div-ами написано уже много статей. Вот одна из них
Ссылка скрыта от гостей
 
S

Scorpicora

Для: Dmirys
Конечно, я не специалист, но насколько мне известно из собственной практики height=100% для таблицы не работает. Ибо как определить, где эти самые 100% кончаются?
 
G

Guest

Прикольные у вас варианты :) но правильных 2:
1. как было указано выше намудрить с таблицами

2.
.
.
<body onLoad="pos()">
.
.
<script language="javascript">
function pos()
{
if(document.all)
{
W=document.body.clientWidth;
H=document.body.clientHeight;
}
else
{
W=innerWidth;
H=innerHeight;
};

document.getElementById('dv').style.left=W/2;
document.getElementById('dv').style.top=H/2;
}
</script>
.
.
.
<style>
.gg{position:absolute;}
</style>
.
.
<div class=gg id="dv">ЦЕНТР ВСЕГО!!!</div>
.
.
.
Вот в таком духе )))
 
G

garrymax

Scorpicora сказал(а):
Конечно, я не специалист, но насколько мне известно из собственной практики height=100% для таблицы не работает. Ибо как определить, где эти самые 100% кончаются?
Нажмите, чтобы раскрыть...
Я тоже такой философии, но скорее всего идет подстановка значений document.body.clientWidth и document.body.clientHeight или innerWidth и innerHeight, посему работает.
 
S

Scorpicora

<!--QuoteBegin-sax_ol+8:11:2007, 13:27 -->
<span class="vbquote">(sax_ol @ 8:11:2007, 13:27 )</span><!--QuoteEBegin-->у table нет свойства height, если мне не изменяет память
[snapback]84761" rel="nofollow" target="_blank[/snapback]​
[/quote]
Вот-вот, и я о том же ;)
 
G

Guest

моё мнение...)

<!--QuoteBegin-sax_ol+8:11:2007, 13:27 -->
<span class="vbquote">(sax_ol @ 8:11:2007, 13:27 )</span><!--QuoteEBegin-->у table нет свойства height, если мне не изменяет память
[snapback]84761" rel="nofollow" target="_blank[/snapback]​
[/quote]
<!--QuoteBegin-garrymax+7:11:2007, 03:16 -->
<span class="vbquote">(garrymax @ 7:11:2007, 03:16 )</span><!--QuoteEBegin-->Проще воспользоваться таблицей:
[snapback]84527" rel="nofollow" target="_blank[/snapback]​
[/quote]

хотя я думаю автор темы уже понял что и как...))
 
D

Dmirys

Ребята, вы не гадайте есть такое свойство или нет. Возьмите код и проверьте его в разных браузерах. И Опера и Файерфокс и Эксплорер жрут этот код без проблем. Тема себя исчерпала.
 
G

garrymax

sax_ol сказал(а):
При чем тут браузеры и то что "жрут "?
Мало ли чего можно в теге написать, это никак не соотносится со свойствами.
Нажмите, чтобы раскрыть...
Для: Dmirys Не спорь с теоретиками - не докажешь :) , даже если предложить им поиграться со значениями параметра height для этой самой таблицы и посмотреть, воспринимают браузеры это, как свойство или нет.

sax_ol сказал(а):
у table нет свойства height, если мне не изменяет память
Нажмите, чтобы раскрыть...
освежи память спецификациями (в HTML почему-то не указано, но в CSS есть), плюс к этому есть такое понятие, как свойство анонимных объектов (наследия свойств) - будешь приятно удивлен.

Самое интересное, что я так же думал, но при использовании редактора стилей TopStyle Lite (
Ссылка скрыта от гостей
) узрел это впервые, а потом уже и в спецификациях нашел.
 
Статус
Закрыто для дальнейших ответов.
Мы в соцсетях:

Обучение наступательной кибербезопасности в игровой форме. Начать игру!

Верх Низ