CSS text shows up under my image

[mrstuff68]

I have the following code, but for some reason the text that I want to display in the footer displays under the images that I have there, how do I get the text to show up ontop of all the images?

CSS

#footer {
	margin : 0 -10px 0 -8.5px;
	width: 100%;
	background : url('FooterBorder.gif') repeat-x;
	height : 36px;
	position: absolute;
	
}

#footer p{
    margin : -36px;
    text-align : center;
	color: #003466;
	font-family: Corbel,sans-serif;
	font-style: oblique;
	border: medium double rgb(250,0,255);
}

#rbtop div { background: url(TopLeft.gif) no-repeat top left; }
#rbtop { background: url(TopRight.gif) no-repeat top right; }
#rbbot div { background: url(BottomLeft.gif) no-repeat bottom left; }
#rbbot { background: url(BottomRight.gif) no-repeat bottom right; }

#rbtop div, .rbtop {
height: 20px;
font-size: 1px;

}
#rbbot div, .rbbot {
height: 36px;
font-size: 1px;
}

HTML

<div id="footer">
	<div id="rbbot"><div></div></div></div>
	<p>Copyright &copy; 2008 - All Rights Reserved	</p>
	</div>
			
        </div>

[Merri]

Add position: relative; to #footer p - you can also add z-index: 1; just to be sure, if you want.

[mrstuff68]

Merri, I added both of those to it and it still doesn't show up.

[Merri]

From what you've given, your HTML structure is broken, you close it many times so that the P element isn't even within the #footer - and #rbtop is missing. So, check the order you open and close elements.

Firefox has DOM inspector and Firebug extension that can help a lot in this kind of situation.