adding "alt" to image with css 1

[technoknow]

How do you add the "alt" text to an image if you are using:

#MainText { background: url(images/MainText.gif) no-repeat; }

in your css, and:

<div id="MainTxtTop"></div>

in the HTML?

Thanks,
technoknow

 

[ChrisHirst]

You don't.


Chris.

Indifference will be the downfall of mankind, but who cares?
Woo Hoo! the cobblers kids get new shoes.

http://www.cram-system.com

Nightclub counting systems

So long, and thanks for all the fish.

 

[Vragabond]

What you're using is not an image. It is a background image for a box (div). Depends why you need the alt attribute. If you need it to let the browsers that cannot display pictures know what it is, then you cannot. If you need it for the tooltip (which is what many people believe it is for) you can use title attribute:

#MainText { background: url(images/MainText.gif) no-repeat; }

<div id="MainTxtTop" title="This be Main Text Top"></div>

 

[technoknow]

Yes, I'm using the alt tag for the browsers that can't display images.
It seems like I remember that there was is way to use the image once in the html with the alt tag and then reuse it with css? No?
Thanks,
technoknow

 

[Vragabond]

Nope. Alt tag refers to image content (describes what image is about) and as such has nothing to do with presentation (which CSS is for).

 

[ChrisHirst]

<pedantic>
alt attribute
</pedantic>

Chris.

Indifference will be the downfall of mankind, but who cares?
Woo Hoo! the cobblers kids get new shoes.

http://www.cram-system.com

Nightclub counting systems

So long, and thanks for all the fish.

 

[blueark]

You could add the "alt" text inside a tag within your div, and use css to hide it:

#MainText { background: url(images/MainText.gif) no-repeat; }
#MainText span { visibility: hidden; }

<div id="MainTxtTop"><span>My Alt Text</span></div>

It's not quite what you're looking for. It shows the alt text when the browser doesn't support css, not images. So, if a browser supported images but not css, you'd see text. If a browser supported css but not images, you'd see nothing. Probably.

 

[technoknow]

Thanks blueark, I'll give that a try.
Tech


Once upon a midnight dreary, while I pondered, weak and weary, over many a quaint and curious volume of forgotten code.