...

View Full Version : text over div?



freshfan
10-26-2009, 09:19 PM
hi!

I have a <div> with an image in it and I want to place text over it, 10px down and 20px from the right.

is there any way to do this besides creating another <div> [which I don't want to do]?

thanks

Excavator
10-26-2009, 10:48 PM
Hello freshfan,
Good call on not adding another div.
If you make the picture a background image of the div and style your text in your CSS you should be able to get what your looking for.
Here's an example... no bg image but you can add that yourself -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
html, body {
font: 14px "Comic Sans MS";
background: #FC6;
}
* {
margin: 0;
padding: 0;
border: none;
}
#container {
width: 800px;
hight: 600px;
margin: 30px auto;
background: #999;
}
p {
margin: 10px 20px 0 0;
}
</style>
</head>
<body>
<div id="container">
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no
sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo
duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</p>
<!--end container--></div>
</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum