Overlay CSS element on another?

Hi,

I’m trying the following:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Test</title>
</head>

<body style="background:#000;margin:0;padding:0">
	<div id="fbContainer" style="position:absolute;background:#999;height:100%;width:100%">
	<div style="background:#000;color:#fff;position:relative;top:0;left:0;width:180px">&nbsp;<a href="/" style="color:#fff">< Home Page</a></div>
		<p>test</p>
	</div>
</body>
</html>

But I’d like my <p>test</p> to be directly behind the Home Page link.

Ultimately I’ll change the Home Page link to an image.

Is this possible with CSS?

Thank you.

You could use relative positiopning on the <p> to move it upwards (top:-15px or whatever) or you could absolutely place the <p> to top:0;left:0; and it will slide on top of the anchor :slight_smile: