Image will not display in Internet Explorer

I am trying to wrap text around an image but I cannot get the image to display in Internet Explorer. I tried using two scripts with the same results:

<span style=“float: left;”><img src=“images/parents-giving-money.png” width=“298” height=“298”></span>

<img src=“images/parents-giving-money.png” width=“80” height=“80” align=“right”>

I even tried removing the height and width info from the script to see if that made a difference but it didn’t.

The image displays correctly in FireFox. However, for some strange reason, the image doesn’t appear in in Windows Explorer. Does anyone have any suggestions as to how I can correct this problem? Thanks.

Hi there,

You didnt’ mention which version of IE you’re using, but prior to Internet Explorer 7, there was very limited support for .png files. I’d suggest substituting a .gif or .jpg and seeing if you have the same issue, if so it’s probably that IE lacks support.

This article may be able to help you with a work-around: http://24ways.org/2007/supersleight-transparent-png-in-ie6

Good luck!

Thank you for your reply. I use Internet Explorer 8. I tried using jpg images with the same results. For some reason, the images display correctly on some of my webpages for both IE and FF but not on the page in question. Any other suggestions?

Do you have a URL we can look at? As it seems like something else is going on such as paths/file names not being correctly referenced, etc. Because if you are just using similar to: <img src=“someimage.jpg” alt=“Photo” /> it should display assuming the image is in RGB available in the correct directory and is named ‘someimage.jpg’ and so-forth.

Sure. The web page in question is http://www.strongfamilies.us/session1.php. If you visit other pages of the site, you will see that png and jpg images are displayed both in FF and IE. But I found a couple of pages, namely the one in question, that doesn’t display images in IE.

I use IE 8. Also, png and jpg images display appropriately in IE from other pages of my site. I’m thinking that there must be something wrong with the coding on the page in question.

viewing in IE7, didn’t see any missing images on that page but did notice a few on your bio page…
http://www.strongfamilies.us/biography.php

the images on that page seem to be covered over by the background color of the Content div…bottom portion of the last image is partially visible. maybe try temporarily removing the background color to see if it does anything…?

Thank you for noticing this on the biography page. I completely over looked that page. I have limited knowledge regarding website development as I had someone put this site together for me. However, I have been editing the site using free software that has been working out pretty well so far. The images on the bio page were inserted by the previous web designer.

How do I go about removing the background color per your recommendation? Thanks.

in the layout.css file, go about halfway down to the area marked Main Area to find Content and just delete the background-color property…


#content {
[COLOR="Red"]	background-color: #FFF;[/COLOR]
	position: relative;
	top: 0px;
	padding: 10px;
}

Thank you for your assistance. Unfortunately, I cannot find a file or folder in my FTP labeled layout.css. There is a folder labeled ‘layout’ that is within the folder labeled ‘images’. But this folder only contains image files along with a folder that is labeled ‘hcc thumbs’.

Can you please tell me where the layout.css file is located? Thanks.

check the folder labeled includes…the css (stylesheet) files should be there.

I found it and deleted background-color: #FFF;. The images now appear on the bio page. I also inserted an image on the page in question and the image now displays within IE as well as FF. Thank you so very much!!!

Will having removed this text cause any functional problems with my site such as the submission of forms, etc…?

your welcome. glad to help. :slight_smile:

no. there should be no functionality problems caused by removing that. changes in the stylesheet file you made would only affect the styling of your webpages…element positioning, spacing, font size, color, background images, etc. the background-color property only added the background color of white to the Content div. since the #main_content div containing Content already has the background color set to white, it probably wasn’t necessary anyway.

Thank you again for your assistance!! I plan to include images this afternoon. I will let you know if I run into any other issues.

I couldn’t find any actual missing images with either Fx or old M$IE 6.0.

Why are the pages using: <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN”> ? It doesn’t seem to any make sense at all you aren’t using Frames so I’d suggest: <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”> for the pages.

There are quite a few code errors too. I think agarcia831 is right the CSS was overlapping/hiding certain parts of the page.

Update: I see you found the issue.

Thank you for your reply. Before you made your last entry, I already removed the background tag which explains why there were no missing images when you checked.

My knowledge of website development is very limited as I had someone else design the site. I don’t know the difference between:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN”> and
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>

or where they can be found. Will replacing the above tag with <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”> improve the site? If so, please let me know where I can find this tag on my site? Thanks.

The DOCTYPE is located at the very top of every html page…the first line in the html code. It basically tells the browser specifically what markup/code you are using. A better and more detailed description here…

Not sure that it’s actually causing any problems now…using the correct doctype is a ‘best practices’ sort of thing, though. In other scenarios, using an incorrect doctype could potentially cause some elements of a page to render in the browser incorrectly…and/or the page wouldn’t validate.

This is probably a silly question but since my knowledge of website development is so minimal, I would rather be safe than sorry: Would replacing this tag as recommended cause any functional website problems? If not, I will replace the tag tomorrow.

not a silly question at all.
no. functionality of your website should not be affected.

referring to the table in the link I gave earlier listing available doctypes, you’ll see that the only difference between the current doctype and the one xhtmlcoder suggested is that the one you have now allows for the use of frames…which your site doesn’t seem to be using/needing…

HTML 4.01 Frameset applies the same rules as HTML 4.01 Transitional, but allows the use of frameset content.

Thank you so much for bringing this issue to my attention. Tomorrow, I plan to replace this tag per your recommendation and add images to the site. I will let you know if I run into any problems. Thanks, again!!