Расположение блока div по центру экрана используя только CSS

Эта статья пригодиться любому новичку, ставшему на путь верстки или ЧутьЧутьВерстки.

Если вам нужно расположить блок/картинку по центру экрана, то нужно поступить следующим образом.
К примеру, нужно разместить изображение 400 х 300 по центру экрана:

<div id="center_block">
   <img src="path-to-image.jpg" alt="" title="" width="400" height="300">
</div>

А теперь в CSS следующие стили:

#center_block
{
   position:fixed;
   top:50%;
   left:50%;
   margin-top:-150px; /* = высота_блока/2 */
   margin-left:-200px; /* = ширина_блока/2 */
}

PS.
в margin-top нужно указывать смещение на половину высоты элемента
в margin-left нужно указывать смещение на половину ширины элемента