Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Позиция DIV / 14 сообщений из 14, страница 1 из 1
27.01.2015, 03:16
    #38863824
Esentuki
Esentuki
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
Здравствуйте, Подскажите как спозиционировать div поверх контента по середине именно видимой части страницы высота и ширина div заранее известны

Сейчас я сделал так:
<DIV style="position:absolute; width:500; height:300; top: 50%; left: 50%; margin-left: -250px; margin-top: -150px;">

Однако такой метод позиционирует div относительно высоты и ширины всего документа а мне требуется без учета полос прокрутки (по середине окна)


заранее спасибо
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.01.2015, 08:08
    #38863877
FishHook
FishHook
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
Код: css
1.
2.
3.
4.
.foo{
    position: absolute;
    top: 50vh;
}
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.01.2015, 09:04
    #38863910
Esentuki
Esentuki
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
Прошу прощения что такое "top: 50vh;" ???
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.01.2015, 09:20
    #38863920
FishHook
FishHook
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
http://habrahabr.ru/post/126863/
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2015, 06:19
    #38864997
Esentuki
Esentuki
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
Нахера нужна единица которая "На данный момент поддерживается только Internet Explorer 9.???" (цитата из статьи на которую ты кинул ссылку) Какой идиот ее будет использовать???
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2015, 09:42
    #38865084
user89
user89
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
EsentukiСейчас я сделал так:
<DIV style="position:absolute; width:500; height:300; top: 50%; left: 50%; margin-left: -250px; margin-top: -150px;">Тут у высоты и ширины, пиксели надо задать, width:500 px ; height:300 px ;   Нормально получается
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
<!DOCTYPE html>
<html>
<head>
<title>abc</title>
<style>
.big {width:4000px; height:4000px; background:#eee;}
.centr {
	position:absolute;
	width:500px; height:300px;
	top:50%; left:50%;
	margin-left:-250px;
	margin-top:-150px;
	border:1px solid #aaa; background:#fff;
}
</style>
</head>
<body>
	<div class="big">Это большой DIV, что делает полосы прокрутки</div>
	<div class="centr">DIV по центру монитора</div>
</body>
</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2015, 10:17
    #38865136
_user89
_user89
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
Esentuki,
 
На всякий случай, если резиновый DIV по центру экрана
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
<!DOCTYPE html>
<html>
<head>
<title>Выравнивание резинового DIV по центру экрана</title>
<style>
.TableCenter {
	position:absolute;
	top:0; left:0;
	height:100%;
	width:100%;
	z-index:-1;
}
.DivCenter {
	background:orange;
	display:table;
	margin:auto;
}
</style>
</head>
<body>
~~~~~~~~~~~~~~~~~~~~~~~~~~~ Некий текст, который просто располагается на странице.<br><br>
<div style="border:4px double #87CEEB;">А это Div, который ни с чем не связан.</div>
<table class="TableCenter"><tr><td>
		<div class="DivCenter">Этот DIV<br>резиновый.<br><br><br>Он выровнен по центру экрана.<br><br>Как по горизонтали,<br>так и по вертикали<br><br><br><br>
		Сериал "Стрела" хороший, но много логических несостыковок.</div>
</td></tr></table>
</body>
</html>

...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2015, 12:16
    #38865342
FishHook
FishHook
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
EsentukiНахера нужна единица которая "На данный момент поддерживается только Internet Explorer 9.???
Статья 2011го года. Сейчас 2015й.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2015, 12:17
    #38865344
FishHook
FishHook
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
EsentukiКакой идиот ее будет использовать???
Какой идиот будет использовать восьмого осла? Ты делаешь сайт для идиотов?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
29.01.2015, 02:57
    #38866129
Esentuki
Esentuki
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
FishHook,
Ну можно сказать и так
На нашем предприятии до сих пор есть ie8...
А мне остается только подстраиваться под такую "политику"
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
29.01.2015, 02:59
    #38866130
Esentuki
Esentuki
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
...кстати она вообще другими браузерами не поддерживается.. только ie 9 и в гору
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
29.01.2015, 11:09
    #38866386
FishHook
FishHook
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
Esentukiкстати она вообще другими браузерами не поддерживается.. только ie 9 и в гору
ЩИТО???????
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
29.01.2015, 12:28
    #38866506
FishHook
FishHook
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
http://caniuse.com/#search=vh
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.02.2015, 10:26
    #38869129
Areostar
Areostar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Позиция DIV
EsentukiЗдравствуйте, Подскажите как спозиционировать div поверх контента по середине именно видимой части страницы высота и ширина div заранее известны

Сейчас я сделал так:
<DIV style="position:absolute; width:500; height:300; top: 50%; left: 50%; margin-left: -250px; margin-top: -150px;">

Однако такой метод позиционирует div относительно высоты и ширины всего документа а мне требуется без учета полос прокрутки (по середине окна)


заранее спасибо

Добавить позиционирование
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Позиция DIV / 14 сообщений из 14, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 345ms
Закрыть
start [/forum/topic.php?fid=22&tablet=1&tid=1446313]:
 0ms
get settings:
 9ms
get forum list:
 15ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 52ms
get topic data:
 9ms
get forum data:
 2ms
get page messages:
 45ms
get tp. blocked users:
 1ms
others: 206ms
total:  345ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]