Text over image | WPDFD.com Forums

Ibelta said:

11/04/04, 309 53 2004 2004:%i:1099623220 21:53:40

How can I have a text box, which its content will appear on top of an image???
Tried layer but it does not work
Any other idea??? : :

Baxter said:

11/05/04, 310 08 2004 2004:%i:1099667319 10:08:39

Layer is some tragic leftover from Netscape 4. You need to use the css background property.

However, if you're talking a form textarea, be forewarned that styling form elements is dicey.

Joe Gillespie said:

11/05/04, 310 37 2004 2004:%i:1099672644 11:37:24

'Layer' is the term used in GoLive and other editors for DIV, and I wish they wouldn't.

The image doesn't have to be in the background of a div. This article...

http://www.wpdfd.com/editorial/wpd0904news.htm#feature

shows how to put text over images using absolute positioning inside a relatively positioned div.

Baxter said:

11/05/04, 310 56 2004 2004:%i:1099673768 11:56:08

Sure, there's more than one way to skin a cat... I've been known to use negative margins, relative positioning tricks, z-index and any number of other methods to achieve the effect. Most times using the simple background property is easiest and most effective.

Most times.

Ibelta said:

11/05/04, 310 02 2004 2004:%i:1099688570 16:02:50

Baxter
Can you give an example?

Ibelta said:

11/05/04, 310 07 2004 2004:%i:1099688840 16:07:20

I need to see the text as part of the image and not like a far background.
I wonder if someone can throw an example here...

Thx

Baxter said:

11/05/04, 310 36 2004 2004:%i:1099690570 16:36:10

OK, say all your text is in a div called "beer"
Your html would look something like

text

more text

and in your stylesheet, you'd have something like
#div {background: {url(whatever.jpg) no-repeat}

For best results, you'd also set the height and width of "beer" in the stylesheet to the same dimensions of your image, and you'd want to set some padding and other characteristics on the text inside the div.

That's the thumbnail version.

Ibelta said:

11/05/04, 310 20 2004 2004:%i:1099693203 17:20:03

I am sorry, I didnt explain well...
I have a text box that user enters data and the content should appear on top of a picture....
Any example?

Joe Gillespie said:

11/06/04, 311 45 2004 2004:%i:1099748731 08:45:31

You could put a text box on top of an image by putting it in a div on top of another div but how a text box looks is very browser dependant. If you mean a transparent text box, you are out of luck.

Ibelta said:

11/06/04, 311 44 2004 2004:%i:1099759497 11:44:57

I tried to modify this one to have text box instead of links but with no success..

http://www.dyn-web.com/dhtml/write-lyrs/info-on-img.html#

Baxter said:

11/08/04, 313 43 2004 2004:%i:1099925006 09:43:26

You can do it exactly how I explained, BUT you're not likely to get it to work with the table-based, rounded corrner box you're using (unless the image is static),

If the image is static, save yourself a lot of aggravation, and just put it together in the rounded corrner box, slice it up, and put it in there.

IF you want it to be dynamic, in your javascript, where it's writing the text string, you'll also have to set the background display property. I forget the exact syntax, and I haven't had my coffee yet, but look at JS style switchers and you should get some clues.