Центрирование HTML-элементов по центру страницы

Я хочу поместить элемент HTML в середину страницы, по горизонтали и по вертикали, но мне трудно заставить его выровняться даже по горизонтали. Я хочу центрировать div "контент". Вот мой css:

#background
{
position:absolute; 
width:100%; 
height:100%; 
margin:0px; 
padding:0px; 
left:0px; 
right:0px;
z-index:1;
text-align: center;
}

#content
{
margin-left: auto;
margin-right: auto;
 width: 200px;
 z-index: 2;
 position: absolute;
}

А вот мой HTML:

<html>
<head>
<link REL="STYLESHEET" TYPE="text/css" HREF="style/myStyle.css"> 
</head>
<body style="padding:0px; margin:0px; overflow:hidden;"> 


 <div id="background"><img src="images/backgroundimage.png" width="100%" height="100%">

 </div>

 <div id="content">

 <p>Here is some content</p>
 </div>

</body>
</html>

Поскольку div должен быть позиционирован как абсолютный, сделать это:

 margin: 0 auto;

не получится. Я не знаю, что делать. Кроме того, я хочу, чтобы он был в центре страницы по вертикали. Помощь приветствуется, спасибо.

Редактировать:Мне нужно, чтобы фон был в отдельном div, чтобы он -менялся по размеру, а содержимое не отображалось, если положение относительное.

5
задан Jack Davis 15 April 2012 в 21:07
поделиться