Форум

Craftist · #1 (**permalink**) 25.02.2016, 16:19

Всем привет. Знаком в js лишь поверхностно. Пытался позиционировать элемент div (id="links") по центру:

var dv = document.getElementById('links');
    dv.style.left = ( screen.width / 2 ) - ( dv.offsetWidth / 2 );
    dv.style.top = ( screen.height / 2 ) - ( dv.offsetHeight / 2 );

Как можно сделать так, чтобы элемент div был по центру экрана не только по горизонтали (align="center"), но и по вертикали?

destus · #2 (**permalink**) 25.02.2016, 16:45

Craftist,
а через CSS нельзя?

рони · #3 (**permalink**) 25.02.2016, 16:50

Craftist,
Все способы вертикального выравнивания в CSS

Feex · #4 (**permalink**) 26.02.2016, 02:24

Craftist,
с помощью css примерно так:

<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.center {
background: #fff;
width: 20px;
height: 24px;
position: fixed;
top: 50%;
left: 50%;
margin-top: -12px;
margin-left: -10px;
}
</style>
</head>
<body>
<div class="center">
<img src="http://javascript.ru/forum/images/smilies/yes4.gif" alt=""/>
</div>
</body>
</html>

width: 20px;
height: 24px;
это размер элемента, в данном случае размер смайла 20х24
margin-top: -12px; - тут задаем половину от значения "height"
margin-left: -10px; - тут задаем половину от значения "width"
вроде и всё.

Craftist · #5 (**permalink**) 26.02.2016, 13:15

То есть, если размеры 75% и 60%, нужно указывать маргины -37% и -30%?

Feex · #6 (**permalink**) 26.02.2016, 22:22

Сообщение от Craftist

То есть, если размеры 75% и 60%, нужно указывать маргины -37% и -30%?

Если в %, то так просто не получится, но и сложного ничего тоже нет: придется поиграться с margin-top

Но в данном варианте решения вопроса, именно с %-ми, идеально не получится все-равно(разное разрешение экранов будет влиять).. Для % лучше другой вариант поискать.

Форум

Справочник

Discord чат

Курсы javascript