<img src="image_that_may_or_may_not_load.png" alt="Show this text if image not loaded" />
Safari doesn't seem to show 'alt' text in case the image is not loaded. I'm not sure about other browsers, but Firefox does show the alternate text.
Its so important to display alt text in email templates where the images would be blocked by the client most likely, atleast until the user accepts to "display images from this user/site".
Any workaround for this?
Thanks
So it turns out, setting width and height for the image will show alt text incase the image is unavailable, not otherwise.
Try use the title attribute.
<img src="image_that_may_or_may_not_load.png" alt="Show this text if image not loaded" title="Show this text if image not loaded" />
Apparently from here: Alt text showing in IE and firefox but not in safari?. Safari doesn't support it.
Related
https://avada.theme-fusion.com/gym/ enter image description here On this website the text "No Pain No Gain" on the first page is fixed with the background image. But after scrolling it is being hidden? How it is done?
it can be done using postion: fixed , and z-index .
please help me with my problem, how to display only name instead of all the description of the images when mouse hover by using any softwares or with php. Generally we can do that in html by using title tag, i want exactly same in normal windows image hovering.
Thanks in advance
I am having issues with weird black lines being displayed through a website I work on in IE 9. I have tried turning off compression but I am at a loss as to what to do about this. Has anyone seen this or can you give me some suggestions?
Web page: http://3dprinterhub.com
IE9 Screenshot: http://i.imgur.com/mLaOB.png
Those "weird black lines" are coming from the A links in your menu.
You have hidden the actual text in the menu by using "span.help" with "visibility: hidden", but the actual A links themselves are still visible (hence the visible lines).
If you add "visibility: hidden" or "text-decoration: none" to your "a.nav_button" and "a.nav_buttons" CSS rules, then the underlines will disappear.
Can anyone tell me how this image is resizing? If you remove the bg from the page with firebug you will have a clear vision of the image.
http://canvas.is/images/logo_solid.png
I notice that when the page is scaled the width and height attributes apply and start to scale the image. I have looked through the page and there is no css indicating a percentage width or height and no js in sight.
How is this working?
Thanks
I would tentatively say this is a browser built-in feature as the url ends with image extension, browser know it's not html page, so it would render it in a different way.
Well, I still do not think there is something magical out there, in a normal html page, if you set a fixed width to an image, browser will resize its height automatically. It's more like this scenario:
<div class="image-wrapper">
<img width="100%" src="..."/>
</div>
image would be resized per its original ratio with the width change of image-wrapper
Can anyone offer any pointers for making sure that the alt tags within an image map are visible when disabling images?
I am using the FireFox Developer toolbar to Replace Images with Alt attributes. All images are replaced with the alt text that corresponds to them, but an image map does not.
You should be putting the Alt tags on the AREA tags, not on the image.
<area href="#" shape="rect" coords="0,25,50,100" alt="A rectangle" />
Also try using Title attributes too.
Oisin