I Need Help With Text Over Images

[Microsoft 0]

like in runescape.com they have text over the scroll paper image thing where they put tere updates, i like to know how to put text on images like whta the code? thank you

[mama_soap 0]

Well, the website you're talking about seems to have simply placed the image and the text together, of course, inside a <div> container... perhaps they have an external stylesheet that reduces the z-index of images.

In any case, what you could try doing is create a separate body.main class and set background image to whatever picture you want, and have an attribute that says no-scroll. For instance:

body.main{background-image:url('whatever');background-repeat: no-repeat;background-attachment: fixed;}

If you aren't particularly familiar with CSS, try visiting the W3Schools training pages.

Cheerio

[Avalon 1]

To put text over an image is quite easy, you can do it with tables by setting the background of a table to an image like this:

<td valign="top" background="img/light_paper.gif">

or using CSS tags like this:

<div style="position: relative; margin-bottom: -35px; padding-left: 7px;"><img style="display: block; position: absolute; width: 466px; height: 50px;" src="http://forums.xisto.com/no_longer_exists/;

There are other ways, but these are the common ways to do it.

Hope that helps.

[Microsoft 0]

some one take a look at this site...

http://forums.xisto.com/no_longer_exists/

look it as IE and FIrefox do you see a difference?

[Lyon2 0]

It's obviously that you're new in cascading style sheet (css), so, if you want a cool ebook about it, just private email me and i send it to you right away.

[guangdian 0]

i'm intersting in the css and i'm a newbie of that.so i like a ebook with that and it's the latest. can you give me one?--guangdian

[Tyssen 0]

<td valign="top" background="img/light_paper.gif">

or using CSS tags like this:

<div style="position: relative; margin-bottom: -35px; padding-left: 7px;"><img style="display: block; position: absolute; width: 466px; height: 50px;" src="http://forums.xisto.com/no_longer_exists/;

Or you could just set a background image for whatever element contains your text, e.g.:

h3#yourText { background: url(yourimage.jpg) top left no-repeat; }

[Microsoft 0]

some one take a look at this site...

 

http://forums.xisto.com/no_longer_exists/

 

look it as IE and FIrefox do you see a difference?

195264[/snapback]

what should i do with this problem in IE it looks messed up the letters/words and in FireFox it looks fine :\

[Microsoft 0]

Well? I visit the website in internet explorer which is better because i can hear the song i can hear it in FF but when i visit it in IE the letters look messed up =\ why does it look fine only in Firefox?