На многих форумах в сайтах видел ответы пользователей "Подскажи, как сделать центрирование блоков по экрану монитора" и так сейчас мы раскажем вам как это сделать.
Как сделать горизонтальное центрирование блока на CSS:
Код
.myBlock{
margin:0 auto;
width:200px;
height:200px;
}
Горизонтальное и вертикальное центрирование блока на CSS:
Код
.myBlock{
width:300px;
height:200px;
position:absolute;
left:50%;
top:50%;
margin:-100px 0 0 -150px;
}
CSS метод центрирования блоков работает ТОЛЬКО с фиксированными размерами width:Хpx; height:Хpx;.
Если же размеры блока у вас не определены, на помощь придет jQuery:
Итак Господа к вашему вниманию, горизонтальное и вертикальное центрирование на jQuery:
Код
$(window).resize(function(){
$('.myBlock').css({
position:'absolute',
left: ($(window).width() - $('.myBlock').outerWidth())/2,
top: ($(window).height() - $('.myBlock').outerHeight())/2
});
});
// Для запуска функции при загрузке окна:
$(window).resize();
Вот и всё!
Данный материал был взять с сайта zornet.ru
Данный материал был предоставлен веб-мастером "workman" 
