General Image in HTML doesn't show

Discussion in 'General' started by Tewhano, Oct 13, 2009.

  1. Tewhano

    Tewhano New Member

    I am having an odd problem with one of the web designs I downloaded. I wanted to use the upper section of the page and just replace it with my own images. One image is defined in the style.css file and the other is in the index.html file:

    Style.css
    Code:
     
    [SIZE=3][FONT=Times New Roman]#head {[/FONT][/SIZE]
    [SIZE=3][FONT=Times New Roman]           position: absolute;[/FONT][/SIZE]
    [SIZE=3][FONT=Times New Roman]           top: 0px;[/FONT][/SIZE]
    [SIZE=3][FONT=Times New Roman]           left: 400px;[/FONT][/SIZE]
    [SIZE=3][FONT=Times New Roman]           width: 370px;[/FONT][/SIZE]
    [SIZE=3][FONT=Times New Roman]           height: 256px;[/FONT][/SIZE]
    [SIZE=3][FONT=Times New Roman]           background: url(images/header.jpg) no-repeat;[/FONT][/SIZE]
    [FONT=Times New Roman][SIZE=3]}[/SIZE][/FONT]
    
    Index.html
    Code:
    [FONT=Times New Roman][SIZE=3]<h1><img src="images/logo.jpg" width="401" height="271" alt="Logo" /></h1>[/SIZE][/FONT]
    
    My problem is that the image referenced by the HTML code doesn’t show. I don’t get the red ‘X’ but instead get a tiny icon representing an image file and the ‘ALT’ text shows. The files I downloaded were the Party Time design.

    I tried copying the index.html file and not altering it and the image doesn’t show. It shows with the original image file just not mine. To determine if there was a problem with the image file I created a bare bones HTML file with just the <img> tag and it shows. As soon as I add the CSS file it stops showing even though the image defined in that file does show.

    Anybody come across this before and know what is causing it?
  2. ishkey

    ishkey Graphics Staff Member

    I downloaded the template and it works just fine, can not reporduce your problem.
    It's possible the problem is on your pc. I would leave the directory you have been working on alone and download the zip file again to a new location. Unzip it into a new directory and try again. You could have a bad spot on your hard drive. If that works just delete the old stuff. If it doesn't work then I would say your hard drive and registry needs cleaning up. Have you had this problem with any other templates, then it could be the software you are using. Maybe it's messed up or needs reinstalling.
  3. Tewhano

    Tewhano New Member

    Thanks for the reply. The original files work fine, its when I change the two images header.jpg and logo.jpg that the problem shows up. I'm experimenting with the size of the images to see if that is where the problem lies.
  4. Tewhano

    Tewhano New Member

    Well it doesn't look like the size is the problem. I resized my two images to the same size as the original images and get the same problem. The image defined in the HTML file doesn't show but the one in the CSS file does.

    I tried using different formats as well for the image files but nothing seems to work. It just doesn't make any sence that changing the images would screw up the display, after all that is what the templates are suppose to be used for. I'm stumped.
  5. ishkey

    ishkey Graphics Staff Member

    did you give the images the same name as those listed in the css and html files or you could have changed the name in css and html files to your files names.
    here's mine

    Attached Files:

    • pt.jpg
      pt.jpg
      File size:
      32 KB
      Views:
      1,186
  6. Tewhano

    Tewhano New Member

    Yes I named my image files logo.jpg and header.jpg just like the original files. Note that it is the logo.jpg file that doesn't show, thats the left image in your example above. The more I fool around with this the more I think it has something to do with my graphic program. If I drop any image file from my collection of web objects (renaming it to logo.jpg of course) into the image folder it works. It doesn't work if I create my own image with CorelDraw 12 and drop that in there. Odd that it only doesn't work for the HTML declaration but works in the CSS file??? I even swapped the two image files (swapped their names) and get the same result.

    I'm using IE8. I'm wondering if IE8 doesn't like the Corel format being called from the image tag but is okay with it in the CSS file???
  7. ishkey

    ishkey Graphics Staff Member

    CorelDraw 12 is not a program for editing either css/ html files. You use a plain txt editor or a html editor.
    I'm confused with this lingo.

    Attached Files:

    • abc.jpg
      abc.jpg
      File size:
      44.4 KB
      Views:
      1,283
  8. bmcoll3278

    bmcoll3278 New Member

    Try to open the image with something like gimp and then save it as the same filename and type.
  9. Tewhano

    Tewhano New Member


    I use Notepad to edit my text not CorelDraw. It would seem we aren't on the same page. I used CorelDraw to make the images which is what I said above:



    Let me see if I can clear up the confusion. I have a collection of web objects; images for backgrounds, logos, bullets and lines, etc. All the cool things you find on the web. When I say 'drop' I mean that I copy an image from my collection and paste it into the 'image' folder in the parent folder where the HTML file resides. So if I take another JPG file (regardless of size or shape) rename it to ‘logo.jpg’ and place that in the 'images' folder then it shows. If I create an image file in Corel and name that ‘logo.jpg’ and place that in the 'images' folder it will not show.

    After much experimentation I finally pinpointed the problem to an incompatibility with the JPG format Corel uses and IE8. I opened the file in FireFox and it worked fine. The only difference is that in the CSS file the image is defined as a background and in the HTML file it places the image via an <img> tag. Why that makes a difference in displaying the images is anybody’s guess. I only know that in IE8 it doesn’t work.

    I only downloaded this template because I thought it would save time in making a new web page I'm working on and I liked the design of the template. I've been using Corel for years and it’s been a love/hate relationship. I know its problems and rather just work around them rather than use another program and have to relearn how to work around its drawbacks. So I'll just use the template as a visual aid and build a web page from scratch.

    I appreciate your time and effort to help me resolve this problem. Thank you.
  10. Tewhano

    Tewhano New Member



    Here is some more Microsoft black magic. I had a colleague create an image from my raw image (the image I am using is cropped from a screen capture) who cropped it, sized it and then saved it as a JPG file. I used that and it worked. I sent her the image file I created and she did nothing to it but save it from PhotoPaint and it didn’t work. So creating the file in another application works but using ‘export’ doesn’t. I’m guessing an ‘export’ doesn’t change the header in the file or something. At any rate it is one of those Twilight Zone moments…queue the theme song.

    Thanks for your suggestion.
  11. ishkey

    ishkey Graphics Staff Member

    JPG format Corel uses and IE8 - what format do they use?
    Just out of curiosity could you post one of you graphics in a zip file.
    and I'm sure you did this, but have you patched cd12
    "CorelDRAW Graphics Suite 12 SP1 Full/Upgrade"
    Alleycode http://www.alleycode.com/ would do a much better job than notepad if you want to check it out plus it's free, unless of course you are a die hard coder.
  12. Tewhano

    Tewhano New Member

    Corel has a whole slew of JPG flavors. The one I use is RPG 24-bit sub format standard 4:2:2. I tired the others but with the same results. I don’t think it is a matter of format per say but what Corel places in the header of the file. I’m only guessing of course.

    Yep, did the updates. I have an older copy of Corel Suite at home. I am tempted to see if that works.

    I'm not so much of a die-hard coder as I am an old dog not wanting to change so I stick with the same tools for years before I finally get something new. I use Corel 9 at home and only use 12 here at work because that's what they bought me.


    Lets see if I can get the attachment to work. It would be interesting to see if you have the same results.

    Attached Files:

  13. Tewhano

    Tewhano New Member

    Okay, this is just too bizarre for words. I got it to work and have no idea why it works. It has nothing at all to do with the image file either. Attached are two HTML files, the images used and the style sheet. ‘index.html’ does not work and ‘index2.html’ does. I see no difference whatsoever between the two markups at all.

    Give it a try and tell me if it works or not for you.

    Attached Files:

  14. Tewhano

    Tewhano New Member

    Is it possible?? I looked over the two files until my eyes were red and the only difference I could see was the blank lines in the file that didn't work. I took them out and it worked! Does that make any sense to anybody?
  15. ishkey

    ishkey Graphics Staff Member

    You got right file format for the jpg. Just plan-o-jpg.
    It was a mater of your directories. In index and index2 your code was looking for a directory called "images"
    Code:
    "[COLOR=red]images/logo.jpg[/COLOR]"
    I got that funky little problem you first did.
    so I created a images directory and it worked. I loaded your files into party time and it worked. May I suggest the use of directories, I mean use a directory for everything not related to the files in the root directory. The root should only have the html and maybe the css files. Plus the necessary server files, sitemap, robot text, those kind of files. Reasons; it is safer, indexes beter, easy to work with. Happy Coreling

    Attached Files:

  16. bmcoll3278

    bmcoll3278 New Member

    Sounds like it to me to.
    very wierd.
  17. Tewhano

    Tewhano New Member

    Thats because the image files are in the folder 'images'. I believe I indicated this in a previous post above.

    So both those HTML files worked for you? Only index2.html works for me. What browser are you using?
  18. ishkey

    ishkey Graphics Staff Member

    I missed the images dir thing. I can make it work in the images dir, the root dir, even from one of my websites.
    ie8, opera10, ff3
    worked in all three without a problem.
    You could be down to needing to clean up the registry or a hard drive with bad sectors. For heck of it and it wouldn't hurt actually help, download eusing free registry cleaner Eusing Free Registry Cleaner: Safely scan and repair registry problems - Spyware FREE.
    believe me when I say it is one of the best, even microsoft lists it in several of the different sections for programmers. It's small, standalone, runs in assembly language so it's fast. I run it every week. You click scan let do its thing the first time takes a few minutes, then click repair and you are done. Try the files again.
    Try clearing your browser cache in IE tools, Internet Options, Browsing History, Delete Temp Files.
    The third would be to create a new directory on the hard drive and work out of it to see if that solves the problem. Defragging a hard drive takes all night. I can't think of anything in any version of IE that would not allow a jpg to show. Let's see where it goes after this, I'll keep working on it.
  19. Tewhano

    Tewhano New Member

    As a network administrator I keep my computer in good shape. I defrag every Friday and use Norton Utilities to keep it running smooth. I ran diagnostics on the hard drive and it checks out okay. I regularly delete temp internet files.

    Every time I think I found the answer to this bizarre problem it seems to change. I have what looks to be two identical HTML files and one works and one doesn’t. Both work for you although you haven’t said what browser you are using. Both work for me in FireFox. And to make it even more weird I just now opened the file that doesn’t work and saved it to a new file called ‘index2.html’ and that file works. That tells me it is a caching issue but I deleted the internet files several times while testing the files. When I view the source code for the broken file from the browser’s ‘view…source’ option the markup is the same as the file that works. That tells me the image is the problem but I am using the same image in both files.

    I think I beat this dead horse long enough. I hate not knowing why something doesn’t work. That is how we learn; fixing broken things. But I am just going to chalk this up to a Microsoft oddity and move on. Thanks for all your help guys.
  20. ishkey

    ishkey Graphics Staff Member

    but I did in line 2 and 3
    All 3 browsers are installed in my machine.

    had to go back and read this posts -
    it sounds more like PhotoPaint blackmagic than Microsofts.
    Anyway it was nice working with you.