View Full Version : bring text to front of image?

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?

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


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.


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">
<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;

<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>

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

<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>

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


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

<html xmlns="http://www.w3.org/1999/xhtml">
<base href="http://www.lockedforums.com" />

<style type="text/css">
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;


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

<p class="c1"><img src="http://www.lockedforums.com/lcorner.jpg" >
<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>