PDA

View Full Version : bring text to front of image?



berry05
Mar 15th, 2008, 09:29 PM
is there a way i can bring text to the front of an image? because there's text in an image and it makes the image seperate and i was wondering if there was a way to send the text to front of image using html code?

effpeetee
Mar 15th, 2008, 09:41 PM
Not sure what you mean. Look at my own site.

www.exitfegs.co.uk

and see if there is anything there that is what you want.
View source, to see the code.
Also, such code as you have would be useful.


Frank

Typical page code.

There are probably better ways to do this.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>here</title>
<style type="text/css">body{
background: #000000;
}

#main {
width: 1200px;
margin: auto;
}

#main.figure {
float: right;
width: 200px;
margin-bottom: 0px;
margin-left: 110px;
position: absolute;
}

#main .figure p {
position: absolute;
width: 360px;
left: 2px;
top: 2px;
background-color: #ddd;
border: 1px dashed #666666;
font-size: .7em;
font-weight: bold;
text-align: center;
padding: 5px;
margin: 0;
}

#main .figure img {
display: block;
}
</style>
</head>

<body id="main">
<div class="figure">
<a href="Picchoosea.html"><img class="c1" alt="Click to move on" src="steve6.jpg" /></a>

<p>Steve, relaxing on the 'Bluebell Railway.</p>
</div>
</body>
</html>

berry05
Mar 15th, 2008, 11:12 PM
this is my code....



<html>
<body bgcolor="999999">
<img src="http://i29.tinypic.com/r8v5fc.png" />
<p align="left"><img src="http://www.lockedforums.com/lcorner.jpg" /><b>Home</b><img src="http://www.lockedforums.com/edit%20act.jpg" /><img src="http://www.lockedforums.com/first_tab_gr_downloads_inactive.jpg" /><img src="http://www.lockedforums.com/last.jpg.jpg" /></p>
</HTML>

effpeetee
Mar 15th, 2008, 11:41 PM
This is what I see.

Where do you want the text.
Or are you after a menu?

if so try here

http://www.dynamicdrive.com/style/CSSlibrary/category/c1/
http://css.maxdesign.com.au/listutorial/index.htm
http://www.cssplay.co.uk/menus/


<!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>
<base href="http://www.lockedforums.com" />

<title>Testing</title>
<style type="text/css">
#caption{
Z-INDEX: 101;
LEFT: 235px;
WIDTH: 258px;
POSITION: absolute;
TOP: 374px;
HEIGHT: 21px;
border: 2px solid red;
text-align: center;
}
<p style="COLOR: #ffffff; BACKGROUND-COLOR: #00364a">
body {
background-color: #999999;
}
p.c1 {text-align: center;
}

</style>
</head>

<body>
<img src="http://i29.tinypic.com/r8v5fc.png" >

<p class="c1"><img src="http://www.lockedforums.com/lcorner.jpg" >
<b>Home</b>
<img src="http://www.lockedforums.com/edit&#37;20act.jpg" >
<img src="http://www.lockedforums.com/first_tab_gr_downloads_inactive.jpg" >
<img src="http://www.lockedforums.com/last.jpg.jpg" ></p>

<div id="caption"> <p>Yes but a very nice photo.</p>
</div>

</body>
</html>

Frank