Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Web Site Functionality _ Images not loading in Firefox/Chrome only in safari

Posted by: anotherstani Apr 5 2011, 04:36 AM

Hi guys.

I am new to HTML and have been trying to customise a tumblr blog. I have done everything I need to do in Safari on my Mac. However, when the page loads in anything other than safari there are certain images that do not appear, not even any sign of anything where they should be.

I have made sure the images are RGB, I uploaded them to imgur, then copied the link and pasted it in the appropriate html code.
The offending images are under 'Find Me' and 'Friends'. It is strange as I have done the exact same thing with the header (upload to imgur, copy paste the link) and that is working fine.

Here is my site

http://www.indieshorts.tv

Any help would be great as I am pulling my hair out here as I am used to figuring things out myself.

Thank you

Mike

Posted by: Frederiek Apr 5 2011, 05:21 AM

Start by fixing the markup errors found by the validator: http://www.htmlhelp.com/cgi-bin/validate.cgi?url=http%3A//indieshorts.tv/&warnings=yes&input=yes .

Posted by: anotherstani Apr 5 2011, 05:28 AM

QUOTE(Frederiek @ Apr 5 2011, 11:21 AM)

Start by fixing the markup errors found by the validator: http://www.htmlhelp.com/cgi-bin/validate.cgi?url=http%3A//indieshorts.tv/&warnings=yes&input=yes .

Thanks for the help.
Problem is, I didn't write the code, I am just changing certain links. So when I looked at that error report, my head started hurting a little bit.

Is there any way of somebody telling what it is thats stopping the images loading in different browsers.

Again thank you for taking the time to reply to me.

Posted by: Darin McGrew Apr 5 2011, 11:46 AM

As Frederiek explained, fix the structural errors reported by our online validator. Browsers recover from such errors differently. Some will do what you expect. Others will do something else.

CODE

Error: element meta not allowed here; check which elements this element may be contained within

If you follow the http://www.htmlhelp.com/reference/html40/head/meta.html link in the error message, you'll find that the meta element belongs in the head element. It cannot go in the body element, as you have it.

CODE

Error: end tag for meta omitted; end tags are required in XML for non-empty elements; empty elements require an end tag or the start tag must end with />
Error: end tag for img omitted; end tags are required in XML for non-empty elements; empty elements require an end tag or the start tag must end with />
Error: end tag for br omitted; end tags are required in XML for non-empty elements; empty elements require an end tag or the start tag must end with />

If you're going to use XHTML, then you need to close empty tags the XHTML way, for example:
<meta ... />
<img ... />
 
rather than:
<meta ...>
<img ...>

CODE

Error: required attribute alt not specified

The alt attribute is required for images. See:
http://htmlhelp.com/feature/art3.htm

CODE

Error: required attribute type not specified

The <script> tag should have a type="text/javascript" attribute.

CODE

Error: ID sidebar2 already defined

The values for id attributes need to be unique. If you need to use a value more than once in the same document, then use the class attribute instead, and change your CSS accordingly.

CODE

Error: element div not allowed here; possible cause is an inline element containing a block-level element
Error: element p not allowed here; possible cause is an inline element containing a block-level element

You can't put a div element inside a p (paragraph) element. You can't put a p element inside another p element. My guess is that you should just delete the extra tags.

CODE

Error: end tag for p omitted; end tags are required in XML for non-empty elements; empty elements require an end tag or the start tag must end with />

Again, I think you should just delete the extra tags. In XHTML, if you open a p element, then you need to close it with a tag. See also:
http://htmlhelp.com/tools/validator/problems.html.en#nesting

CODE

Error: element style not allowed here; check which elements this element may be contained within

Follow the http://www.htmlhelp.com/reference/html40/head/style.html link. The style element belongs in the head element, not in the body element.

CODE

Error: unclosed start-tag

You have

QUOTE

instead of

QUOTE

Posted by: anotherstani Apr 5 2011, 12:39 PM

Thank you so much for taking the time to detail a reply like that. I will try and implement everything this evening.

Thanks again