Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   Как расположить элемент по центру? (https://javascript.ru/forum/xhtml-html-css/3929-kak-raspolozhit-ehlement-po-centru.html)

Cosworth 07.06.2009 00:39
Как расположить элемент по центру?
 
Вообщем ситуация такая - есть div, размер которого неизвестен. Надо расположить его на странице строго по центру (центр diva должен совпасть с центром экрана). Впринцепе алгоритм прост - установить margin-top/left в -50%от высоты/длины diva и top=left=50%. Единственная проблема - как найти эти параметры? Можно ли достать их через js?

Octane 07.06.2009 01:21
Измерения окна, документа и элементов

B~Vladi 09.06.2009 10:04
Расположить по горизонтали без размеров можно с помощью margin:0 auto;, а вот по вертикали нельзя:(

Octane 09.06.2009 20:33
Цитата:
Сообщение от B~Vladi (Сообщение 21273)
Расположить по горизонтали без размеров можно с помощью margin:0 auto;, а вот по вертикали нельзя:(
Для абсолютно-позиционированных элементов это правило не применимо.

B~Vladi 10.06.2009 10:16
Цитата:
Сообщение от Octane
Для абсолютно-позиционированных элементов это правило не применимо.
Дк кто ж знал про абсолют?!:)

B~Vladi 10.06.2009 10:16
Не получицца... если не прав - увольте меня...

Octane 10.06.2009 13:44
Цитата:
Сообщение от B~Vladi (Сообщение 21403)
Дк кто ж знал про абсолют?!:)
Тему читать надо, прежде чем что-то писать.

B~Vladi 10.06.2009 14:55
Цитата:
Сообщение от Octane
Тему читать надо, прежде чем что-то писать.
Цитата:
Сообщение от Cosworth
Как расположить элемент по центру?
Вообщем ситуация такая - есть div, размер которого неизвестен. Надо расположить его на странице строго по центру (центр diva должен совпасть с центром экрана). Впринцепе алгоритм прост - установить margin-top/left в -50%от высоты/длины diva и top=left=50%. Единственная проблема - как найти эти параметры? Можно ли достать их через js?
Где речь про абсолют?!

B~Vladi 10.06.2009 15:16
длину/высоту дива можно получить из offsetWidth/offsetHeight. Какие ещё параметры тебе нужны?!

x-yuri 10.06.2009 15:22
Цитата:
Где речь про абсолют?!
здесь:
Цитата:
top=left=50%

B~Vladi 10.06.2009 15:31
Цитата:
Сообщение от x-yuri
здесь:
Где здесь?! Это не обязательно абсолют.

x-yuri 10.06.2009 15:41
для начала глянь http://www.wpdfd.com/editorial/thebox/deadcentre4.html

Цитата:
Где здесь?! Это не обязательно абсолют.
какие есть варианты?

B~Vladi 10.06.2009 15:44
relative. тогда в этом случае margin: 0 auto; будет работать.

B~Vladi 10.06.2009 15:53
Центрировать какими средствами надо?! JS или CSS?! Если CSS, то без размеров не сможешь. Если JS, ставишь диву left=top=50%, div.style.marginLeft=-div.style.offsetWidth/2+'px' и div.marginTop=-div.offsetHeight/2+'px'.
Если необходимо учитывать скролл - плюсуем соответствующие значения.

B~Vladi 10.06.2009 16:17
Цитата:
Сообщение от x-yuri
для начала глянь
И что?! это не то, что нужно. Там жёстко заданы размеры.

Octane 10.06.2009 16:38
B~Vladi, автор темы все четко описал, хватит тупить.

B~Vladi 10.06.2009 16:44
Цитата:
Сообщение от Octane
хватит тупить
ок


Часовой пояс GMT +3, время: 08:40.