Center Align on a Absolutely Positioned Div

Question

div#thing
{
 position: absolute;
 top: 0px;
 z-index: 2;
 margin: 0 auto;
}

<div id="thing">
<p>text text text with no fixed size, variable font</p>
</div>

The div is at the top, but I can't center it with <center> or margin: 0 auto;

Answer 1

Your problem may be solved if you give your div a fixed width, as follows:

div#thing
{
 position: absolute;
 top: 0px;
 z-index: 2;
 width:400px;
 margin-left:-200px;
 left:50%;
}

Answer 2

Dave Shea (mezzoblue) has written a good article on the subject with explanations and examples: Horizontally Centered Absolute Positioning

Answer 3

@JacobE Can I center the <p> inside the <div>?

Answer 4

Yes:

div#thing { text-align:center; }