Text will not center?

I am having an issue with text not being aligned in the center of a DIV.

I have tried:

text-align:center;

and

width:225px; /*width of div*/ 
margin:0px auto;

and it will not center.

Here is the HTML and CSS for the DIV.

HTML

<div id="past">
<h3><a href="/artistphotos/">View Past Messages</a></h3>
</div>

CSS

#past{
    position:absolute;
    left:0;
    top:363px;
    width:225px;
    height:50px;
    background-image:url('../images/members/roundedbox.png');
    z-index:10;
}

I have applied the text-align and margin using inline styles while I was building the page. I have applied it to the div, h3, and a elements and it won't work in any of them.

What am I missing here? Thanks!

Here is the HTML Code: (excluding the header and footer elements)

<div class="center over_all_under">
</div>
<!--[if !IE]>start intro<![endif]-->
<div class="center">
</div>
<!--[if !IE]>end intro<![endif]-->
<!--[if !IE]>strat main<![endif]-->
<div class="wrap_fullwidth" id="main">
<div class="center">
<br />
<div id="homepage">
    <div id="homepage-main">
        <div id="homepage-main-item" class="full_shadow>{module_adrotator,5622}
        <div id="past">
          <h3><a href="/artistphotos/">View Past Messages</a></h3>
        </div>

This is followed by a lot of code. I could paste it here but because it is hard to read I only included the code above the div.

text-align:center; works fine for me: http://jsfiddle.net/mrchief/bhtZe/

#past {
    position:relative;
    left:0;
    top:363px;
    width:225px;
    height:50px;
    background-image:url('../images/members/roundedbox.png');
    z-index:10;
    text-align:center;    
}

Update: After looking at the page, remove position: absolute from #past h3 as that is preventing the href from center aligning (it gets absolutely positioned).

Also, your div width is small, if you intent to center it on parent background, set #past width to 100%.

It's because you have position:absolute With absolutely positioned elements, they are taken out of the flow, and the margin doesn't mean anything.

You can try centering the image by putting it inside a different absolutely positioned DIV, which has a width of 100%. Then leave #past with a relative position, and use the margin trick.

Here's a working example: http://jsfiddle.net/c5xaW/

Inside of you #past css rules, add this:

text-align: center;

It should work. I tried it here. Try adding and removing the rule and see what happens.