Как выровнять элемент div, используя центр страницы в качестве ссылки?

Question

Так что я пытаюсь получить элемент, чтобы выровнять определенный процент от ЦЕНТРА страницы.

Так что я попытался заменить, где я обычно ставлю процент от левого или справа с «центром»

.aboutcredit { 
    z-index:-100000; 
    center:25%; 
    top:75%; 
    transform:translateY(-50%) translateX(-50%); 
    position:fixed; 
    text-align:center; 
    vertical-align:middle; 
} 

, но не повезло. Вид, что я пытаюсь сделать здесь:

Answer 1

Я столкнулся с этим несколько раз, и то, как я это делаю это: 1. Установите элемент в позицию абсолютного 2. установите элемент, используя проценты, в область, в которой вы хотели бы ее, чтобы сосредоточиться на странице, она осталась бы: 50%, margin-left: - {width/2}, но в этом случае она оставлена: 75%, margin- слева направо: - {ширина/2}

.box { 
height:400px; 
width:400px; 
border:1px solid black; 
left: 75%; 
margin-left:-200px; 
position: absolute; 
} 

http://plnkr.co/edit/7j8DxiUUASrn8wQqBKNW?p=preview

Answer 2

Я не знаю, заметили ли вы, но center:25%; ничего не делает. Вероятно, вы хотите left:50%. Видя, как вы хотите, чтобы он был перемещен на 25%, сделайте его left:75%;, и это должно быть то, что вы ищете. Как так:

.aboutcredit { 
 
    width: 50px; 
 
    height: 50px; 
 
    background-color: black; 
 
    z-index: 1; 
 
    position: absolute; 
 
    left: 75%; 
 
    top: 50%; 
 
    transform: translate(-50%); 
 
    text-align: center; 
 
    vertical-align: middle; 
 
}

<div class="aboutcredit"></div>

Answer 3

.aboutcredit { 
    z-index:-100000; 
    left:50%; 
    top:50%; 
    transform:translateY(-50%) translateX(-50%); 
    position:fixed; 
    text-align:center; 
    vertical-align:middle; 
} 

http://jsfiddle.net/gerLkswu/1/