Как да dynicamlly център на центъра на div въз основа на размера на екрана - javascript, css

Наистина мислех, че това ще бъде просто, но аз съмгубейки ума си! Просто искам да центрирам div в div на екрана. Но не в горния ляв ъгъл на div в центъра на екрана, а в центъра на div в центъра.

Тук е моят div css

.box
{
padding-top:20px;
padding-left:5px;
background-color: #ffffff;
background-color: rgba(221,221,221,0.5);
border: 1px solid black;
border-radius: 25px;
filter: alpha(opacity=90);
height: 125px;
width: 250px;
z-index: 1;
}

<form id="form1" runat="server">
<div id="box"><div>
</form>

Благодаря! Не можах да разбера как да накарам html да се отстрани в кодов блок. Това е център хоризонтално и вертикално.

Отговори:

Използвайте позиция: абсолютна, ако имате нужда от нея, центрирана както хоризонтално, така и вертикално:

#box {
position:absolute;
top:0; left:0; right:0; bottom:0;
margin:auto;
/* etc */
}

http://jsfiddle.net/wcFMw/

За да центрирате хоризонтално:

margin:auto;

За да центрирате вертикално:

position: absolute;
top: 0; left: 0; bottom: 0; right: 0;

Можете също да използвате position: fixed за да направи div центриран дори при превъртане на страницата.

Също така имайте предвид, че ще трябва да използвате # вместо . за да изберете от документ за самоличност. . е CSS селекторът, използван за клас.

JsFiddle

margin:0 auto;

Добавете това свойство към вашия css клас.