471,319 Members | 1,582 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,319 software developers and data experts.

HTML/XML/CSS display problems on Apache shared host

I'm a senior citizen with a tech background, though a newbie to programming and style sheets. I'm usually able to make HTML and css changes to existing designs, but I'm stuck on this one and would like some help. I'm using Amaya as an HTML/XTML editor and my pages comply with the XML standards.

The web pages display perfectly on my Windows XP, service pack 3, home pc, with either Firefox 3 or IE 7 (I think). However, when I move the pages to my 1and1 shared Apache Linux host some aspects don't display properly. A properly displayed page from the template author is at http://www.dcarter.co.uk/green_80.html.

When I upload to my 1and1 host the images used to give the pages some depth and color variation don't show up. The dark vertical borders are missing, the top and bottom border green/white variation is missing, and the right sidebar link arrows are missing. They're all incompletely referenced in the color style sheet, but that doesn't seem to be the problem as the main logo image displays and I also tried complete path referencing to no avail.

The images in question are back.png, main.png, linkfoot.png, link_arrow.png, and link_arrow_sel.png. I also tried converting them to jpg but that didn't help.

The link to my main index page is www.balanced-life.biz. The style sheets are at www.balanced-life.biz/style/style.css and www.balanced-life.biz/style/colour.css (the template is from the UK). The images are all in the style folder along with style.css and colour.css.

I hope someone can help me as I've tried everything I can think of for the past couple of weeks and haven't found anything on the Internet referencing either Linux or 1and1 shared-host display problems.
Oct 30 '08 #1
18 3289
drhowarddrfine
7,435 Expert 4TB
I'm getting ready for dinner and not on my dev computer but I can make a quick note till I get back.

XHTML1.1 is to be served as application/xml+xhtml only and I'd bet you are serving it as text/html. That probably has nothing to do with your problem but it is something you need to address.

Many times these free servers mess with the markup before they send it out but I don't see any such thing after a quick glance. Like I said, unless someone else like David jumps on this, I'll look when I get back from dinner.
Oct 30 '08 #2
David Laakso
397 Expert 256MB
I hope someone can help me as I've tried everything I can think of for the past couple of weeks and haven't found anything on the Internet referencing either Linux or 1 and1 shared-host display problems.
Do you have an (x)html/css question?
Oct 30 '08 #3
drhowarddrfine
7,435 Expert 4TB
As it turns out, I was looking at the wrong link. Which browser are you looking in where things are messed up? The very first line is the xml prologue. While this is proper usage, IE will go into quirks mode and not attempt to act like other modern browsers. I think that was fixed in IE7, though.
Oct 30 '08 #4
As it turns out, I was looking at the wrong link. Which browser are you looking in where things are messed up? The very first line is the xml prologue. While this is proper usage, IE will go into quirks mode and not attempt to act like other modern browsers. I think that was fixed in IE7, though.
Thanks for taking a look. It appears the same in Firefox 3 and IE 7, both look fine on my home pc, both lack the visual effects I noted when on the server.
Oct 30 '08 #5
David Laakso
397 Expert 256MB
It appears the same in Firefox 3 and IE 7, both look fine on my home pc, both lack the visual effects I noted when on the server.
Bear with me: What is the uri that: "appears the same in Firefox 3 and IE 7, both look fine on my home pc, both lack the visual effects I noted when on the server."
Oct 30 '08 #6
Bear with me: What is the uri that: "appears the same in Firefox 3 and IE 7, both look fine on my home pc, both lack the visual effects I noted when on the server."
The problem is evident at www.balanced-life.biz, which points to the index page, but any pages linked from there have the same problem.
Oct 30 '08 #7
David Laakso
397 Expert 256MB
With your page on my screen in FF/3.0.3, IE/7.0, and IE/6.0 at the same time and adjacent to each other, I am not able to distinguish any significant difference among them, other than the obvious-- you've not corrected IE/6 for quirksmode (and while that is correctable, neither it, nor the markup errors on the page, have anything to do with what you wrote about).

Are you certain you have uploaded all image to your host/server. Please confirm you have done so. Clear the cache in all your browsers. Close all browsers. Boot. Open browsers and view the page in them. And if you still have the same issue -- when viewed in real browsers (not your editor), on-line (not off-line), please write back-- providing a screen shot of how it should look. Thanks.
Oct 31 '08 #8
I've done all that you suggested but don't seem to be authorized to attach images. Or I don't understand how to do it. When I click insert image it asks me for text to include between IMGxxxx/IMG. How do I show you the screen shot of how the site should look?
Oct 31 '08 #9
David Laakso
397 Expert 256MB
The images appear to be on the server. These are two possibilities.
1/ The images paths are not correct.
2/ The image paths are correct, but the browser is not displaying the images because they are corrupt.
Nov 1 '08 #10
I'd like to attach a screen shot of the way the page should look but have no option to browse for an image to upload and when I click the insert image icon it asks me to enter [IMG]xxx/{IMG]. I don't know what that is nor how to do it.

Regarding your two suggestions, I'll triple check the image paths and reload the images from my home pc where they display just fine.

Thanks for all your help
Nov 1 '08 #11
The images appear to be on the server. These are two possibilities.
1/ The images paths are not correct.
2/ The image paths are correct, but the browser is not displaying the images because they are corrupt.
Thanks! I did both of your suggestions and it's looking fine now! Though the partial url's worked for one image I changed all image url's to the complete path name and I also reloaded the images. Perhaps they were corrupted in the initial upload.

Thanks again for being patient with a newbie.
Nov 1 '08 #12
David Laakso
397 Expert 256MB
Thanks! I did both of your suggestions and it's looking fine now!
Good. But you are not out of woods just yet. Or are you?
No version of Internet Explorer has a clue regarding the doctype you feed them. The document markup is invalid. And the page is whacked in IE/6.0.
Nov 1 '08 #13
Oh! OK, I see the problems now. I went to W3C's validator and now see the errors. I've been assuming that Amaya, a W3C product, is an accurate tool for compliance to the standards, but I may have a buggy version or it isn't as sound as I assumed. I'll use the validator to resolve what I can.

The pages look fine in Firefox 3 and IE7. I don't have IE6. What should I change about the doc type? It came automatically from Amaya when I opened a new page.
Nov 3 '08 #14
drhowarddrfine
7,435 Expert 4TB
Amaya is an editor like any other and you can type any ol' crap in it just like any other. It won't stop you from doing that.
Nov 3 '08 #15
David Laakso
397 Expert 256MB
Who cares what any basic or advanced editing tool says about Web Standards? The w3c Markup Validation Service correctly declares you have 12 errors . Sites that meet Web Standards, among other things, have valid CSS and valid markup (unless an experienced designer is knowingly feeding compliant browsers, or a particular compliant browser, an advanced selector for "progressive enhancement" need that may not be currently in the validation system because it is only supported by two browsers. Such is not your case. Therefore your "tool" is wrong.

You have your file saved as whateveryoururiis.html. Make a copy of it and save it as whateveryoururiis.xhtml and load it on your server. Open it in a compliant browser and it will throw the twelve errors. Then view the .xhtml page in any version of Internet Explorer. No version of Internet Explorer will even be able open your page. No version of Internet Explorer understands xhtml. Feed IE a strict 1.0 doctype like this (see below) -- I included the xml declaration. The xml declaration puts IE/6 in quirksmode. Your page is broken in IE/6. If you don't care-- delete the xml prologue. If you want to fix the page for IE/6, leave the xml declaration. Pages that meet Web Standards work in "live" browsers-- IE/6 is still very much alive. Therefore your tool is wrong. Your page does not meet Web Standards.
Expand|Select|Wrap|Line Numbers
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  3.     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5. <head>
  6. <meta http-equiv="content-type"
  7. content="text/html; charset=utf-8" />
  8. <title>your document title</title>
  9.  
Now that I've ruined your day, if not your entire life, I think give all this up and become a plumber...
Nov 3 '08 #16
Who cares what any basic or advanced editing tool says about Web Standards? The w3c Markup Validation Service correctly declares you have 12 errors . Sites that meet Web Standards, among other things, have valid CSS and valid markup (unless an experienced designer is knowingly feeding compliant browsers, or a particular compliant browser, an advanced selector for "progressive enhancement" need that may not be currently in the validation system because it is only supported by two browsers. Such is not your case. Therefore your "tool" is wrong.

You have your file saved as whateveryoururiis.html. Make a copy of it and save it as whateveryoururiis.xhtml and load it on your server. Open it in a compliant browser and it will throw the twelve errors. Then view the .xhtml page in any version of Internet Explorer. No version of Internet Explorer will even be able open your page. No version of Internet Explorer understands xhtml. Feed IE a strict 1.0 doctype like this (see below) -- I included the xml declaration. The xml declaration puts IE/6 in quirksmode. Your page is broken in IE/6. If you don't care-- delete the xml prologue. If you want to fix the page for IE/6, leave the xml declaration. Pages that meet Web Standards work in "live" browsers-- IE/6 is still very much alive. Therefore your tool is wrong. Your page does not meet Web Standards.
Expand|Select|Wrap|Line Numbers
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  3.     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5. <head>
  6. <meta http-equiv="content-type"
  7. content="text/html; charset=utf-8" />
  8. <title>your document title</title>
  9.  
Now that I've ruined your day, if not your entire life, I think give all this up and become a plumber...
Color me undaunted ;-)
I'll have to get a copy of IE6 and see how bad it looks. Meanwhile, the 12 errors are all attributed to the signup form which registers people in my auto-responder. The auto-responder, Infinite Responder, is pretty neat, is open source (free), but unsupported. So I'll see if I can fix the errors without damaging the form's function.

If you'd be so kind as to indicate exactly what lines I should delete if I wish to delete the xml prologue and what I should replace them with, if anything.

Thanks for your help ... and patience.
Nov 3 '08 #17
David Laakso
397 Expert 256MB
Assuming you are about to do the right thing and support the still very much alive IE/6:

Use the above doctype with the xml (its a declaration, not a prologue, even though it precedes the doctype) to put IE/6 in quirksmode (no effect on IE/7), and make these changes to the CSS to bring IE/6 on board:

Expand|Select|Wrap|Line Numbers
  1. html {font-size: 100%;}<------ :: squelch IE (all versions) font-scaling bug (makes fonts go goofy at any of the 5 font-size settings)
  2. body {text-align: center;}<---:: centers page rail to rail in IE/6
  3. #menu ul {margin: 0; padding: 0;}<--------- :: new selector :: draw mwnu left by killing IE/6 defaults
  4. * html #links, 
  5. * html #footer {width: 766px;} <-------- :: paints background in IE/6 (only IE/6 sees the star hack ::
  6.  
If your PC OS is XP this in a fast (free) simple install of IE/6 standalone .
Nov 4 '08 #18
Assuming you are about to do the right thing and support the still very much alive IE/6:

Use the above doctype with the xml (its a declaration, not a prologue, even though it precedes the doctype) to put IE/6 in quirksmode (no effect on IE/7), and make these changes to the CSS to bring IE/6 on board:

Expand|Select|Wrap|Line Numbers
  1. html {font-size: 100%;}<------ :: squelch IE (all versions) font-scaling bug (makes fonts go goofy at any of the 5 font-size settings)
  2. body {text-align: center;}<---:: centers page rail to rail in IE/6
  3. #menu ul {margin: 0; padding: 0;}<--------- :: new selector :: draw mwnu left by killing IE/6 defaults
  4. * html #links, 
  5. * html #footer {width: 766px;} <-------- :: paints background in IE/6 (only IE/6 sees the star hack ::
  6.  
If your PC OS is XP this in a fast (free) simple install of IE/6 standalone .
Thanks, I'll try this and let you know how it turns out.
Nov 4 '08 #19

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

3 posts views Thread by zorro | last post: by
12 posts views Thread by Jean-Yves Simon | last post: by
15 posts views Thread by Birahim FALL | last post: by
3 posts views Thread by madunix | last post: by
reply views Thread by rosydwin | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.