Вертикално центриране чрез CSS
Тъй като сам достигнах до момента, в който ми се наложи да центрирам вертикално, чрез търсене в различни статии и форуми, намерих начин това да стане!
Да предположим, че имаме един DIV (образно ще го наречем mydiv, който искаме да центрираме вертикално!.
Нека той да бъде с размери - ширина 400px и височина 320px:
Ето и как ще стане това центриране:

<html>
<head>
<style type="text/css">
<!--
* {
margin:0;
padding:0;
height:100%;
}
#mydiv {
position:absolute;
width:400px;
height:320px;
text-align:center;/*така центрираме хоризонтално */
top:50%;
left:50%;
margin-top:-160px;/* половината от височината */
margin-left:-200px;/* половината от ширината */
border:solid 2px red;/*само за по-добро очертаване на div-a */
}
-->
</style>
</head>
<body>
<div id="mydiv"><img src="slack1.jpg" width="400" height="320"></div>
</body>
</html>

По-този начин DIV-a се центрира и хоризонтално и вертикално!Така и при различните резолюции , този DIV си остава по средата на броузъра!
DEMO




/ Трябва да сте регистриран за да напишете коментар /
От: renegat96
20:59 23-11-2009
Можеше просто да направиш margin-top: auto; margin-buttom: auto;
От: emagi
21:06 23-11-2009
Това, което си написал пробвал ли си го, или пишеш наизуст.Я направи един такъв файл и дай да го видим
От: hakera1501
18:08 25-04-2010
Благодаря за урока
А АВТОРСКИ ЛИ Е ?
От: emagi
20:24 25-04-2010
Не!!!
Това съм го гледал някъде, и съм го запомнил!
Не помня точно къде съм видял това фрагмент от код, но работи!
От: batmanabg
13:16 22-07-2011
Полезен урок.
1