Solved

write over an image

Posted on 2006-06-30
10
1,068 Views
Last Modified: 2008-01-09
Hi, I'm trying to load sever images into a table so there only appears to be one image present.  This I've been able to do fine but when but I need to be able to write over the images so the images act like background.  I assume the way to do this is with layers but I've been unsuccessful so far.  Any suggestions?


here is my code

<html>

<head>
<title></title>
</head>



<style>

body{

background-color:#0f0c67;


}


table{

margin-left: auto;
margin-right: auto;
padding:0px;
border-collapse:collapse;
border-color:#0f0c67;
position:absolute;
}


td {
padding:0px;
margin:0px;
border-collapse:collapse;
border-color:#0f0c67;
}




</style>
<body>
<table>

<tr>
<td>
<!- **************************This is where I'm trying to place the text ********************* ->
<div id="layerHead" style="position:relative; left:0px; top:0px;">
<p>This is a test, I reapeat this is only a test</p>
</div>
<img src="head.jpg" />
</td>
<!- ******************************************************************** ->
</tr>
<tr>
<td><img src="body.jpg" /></td>
</tr>
</table>
</body>
</html>
0
Comment
Question by:sai4
  • 4
  • 4
  • 2
10 Comments
 
LVL 30

Expert Comment

by:callrs
ID: 17021742
Have you tried z-index?
http://www.w3.org/TR/WD-positioning-970131#Z-order     Positioning HTML Elements with Cascading Style Sheets
0
 
LVL 30

Assisted Solution

by:callrs
callrs earned 200 total points
ID: 17021746
Or a background image:
http://www.w3schools.com/html/html_backgrounds.asp     HTML Backgrounds
http://www.echoecho.com/htmlbackgrounds02.htm     Backgrounds : Background Image - HTML tutorial
http://www.w3schools.com/css/css_background.asp     CSS Background Properties
0
 
LVL 30

Expert Comment

by:GrandSchtroumpf
ID: 17023593
I vote for using a background image.
0
 

Author Comment

by:sai4
ID: 17024275
my problem with using the background image is not dispalyed unless you are you that much area in your document.  I got the layers to work right after I posted this but when I load the layer inside the table, I can still type my way right out of the table.

I'm going to try it with the backgrounds, but is there any way I can confine my <div> to the inside of the table?  I though about setting the width of the div to the width of the picture loaded inside the table.


thank you
Steve  
0
 
LVL 30

Expert Comment

by:callrs
ID: 17024338
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 30

Accepted Solution

by:
GrandSchtroumpf earned 300 total points
ID: 17024370
if your image is part of the presentation, then using a CSS background image is the only correct way.
if your image is part of the content, then placing it in the html is the only correct way.

from the name of your images (head.jpg, body.jpg), it seems like they are part of the presentation.
0
 

Author Comment

by:sai4
ID: 17025084
if I use background images, is there anyway I can control the size of the image?


thank you
Steve
0
 

Author Comment

by:sai4
ID: 17025202
hey guys below is what I, and it gives me some control over how much background is displayed.  


my problem now is that all my text starts out centered in midle of the page, is there anyone around this.

1) crate a table and load the image  as a background image for the table.  
2)create two images with a very small width and that have the height of the actually image. The color  of the image should match whatever background color is being used.
3) use css to set the width of the table.
(thise doesn't stretch the image at all just displays how much of the background you want displayed)





0
 
LVL 30

Expert Comment

by:callrs
ID: 17027396
Hi. Can't answer yet. Backlogged with work for up for a couple days.
0
 

Author Comment

by:sai4
ID: 17027502
callrs, that's cool

thank you for your help


Steve
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…

911 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now