I am quite new to website creation using html, and I started making a webpage initially & erased the quotes "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd". Later on, I decided to put it back in.
However, with the quotes, I discovered that both my background-image: url(); don't show up. And with the quotes, my webpage shifted to the middle of the page - which is what I want, my monitor is only 19inch so still quite small by today's standard. Without the quotes, my webpage looks aligned to the left of the screen.
Ideally, I would like to see my webpage in the middle of the screen - how do I control it? Also, why doesn't the background-image work anymore with the quotes?
By the way, the complete quotes is <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
I am happy to post both websites here if you don't understand what I've written, so you can see what I mean!
Full Version: Problems with w3c html help please!
Please see the FAQ entry What is a DOCTYPE? Which one do I use? Don't worry about the parts of the doctype declaration. Just copy-paste the entire thing as the first line of your document.
QUOTE(Darin McGrew @ Dec 15 2011, 01:12 AM) 
Please see the FAQ entry What is a DOCTYPE? Which one do I use? Don't worry about the parts of the doctype declaration. Just copy-paste the entire thing as the first line of your document.
Thanks for your reply. I have done as you suggested without a solution. In order to illustrate my unique problem, my website is directory0.co.cc (with the doctype quotes), and directory0.co.cc/diet_and_weight_loss (without the doctype quotes)
Now the code for both websites are exactly the same except for the quotes. Obviously I would like to have my website centered - how to do it? & with background-image showing! Why is this happening?
Why don't you try copying all my codes into your own html editor & see if you can replicate the fault? Just change the quote -first line (with & without) and see the difference. Actually, my html visual editor does not show the problem, only when I publish it onto my webhost.
Click the second link in the FAQ entry Darin linked to. The short doctype without URL will give you Quirks Mode which means browsers emulate older an buggier version of themselves.
This is called doctype switching. It isn't easy to get your head around, but at least glance at Sivonen's page. What you need to understand is that browsers have two rendering modes, that they are triggered by the doctype and you want to use a doctype that triggers Standards Mode (AKA as Strict Mode).
No one surfs with an editor. Use a browser to preview. If your editor's preview doesn't show a difference the problem is with the editor.
This is called doctype switching. It isn't easy to get your head around, but at least glance at Sivonen's page. What you need to understand is that browsers have two rendering modes, that they are triggered by the doctype and you want to use a doctype that triggers Standards Mode (AKA as Strict Mode).
QUOTE
Actually, my html visual editor does not show the problem
No one surfs with an editor. Use a browser to preview. If your editor's preview doesn't show a difference the problem is with the editor.
Actually, whenever I tried to change the first line to something else, after clicking on save in my html editor, it always reverts back to
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
So, my choice is either I have it, or not - if I delete it, it stays deleted. My question is, can anyone not see the differences between my 2 websites? (Which are supposed to be identical except for the first line). & so far, I still do not have a solution to my problems - once again I need my website to be centered, & background-image showing which remains a problem!
How can I preview using a browser? You mean something like IE or Firefox? The "preview" function on my editor shows the background-image, & it also shows the webpage without any spaces on the left or right, unlike IE when I can check my own website as the whole world would see it. So, I cannot troubleshoot this problem in my editor - so this problem really sucks!
I can't see any problems with the programming (code), so, could there be any problems with the main.css or style.css files? Can they be edited? Cos I think I just copied them from somewhere to start with.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
So, my choice is either I have it, or not - if I delete it, it stays deleted. My question is, can anyone not see the differences between my 2 websites? (Which are supposed to be identical except for the first line). & so far, I still do not have a solution to my problems - once again I need my website to be centered, & background-image showing which remains a problem!
How can I preview using a browser? You mean something like IE or Firefox? The "preview" function on my editor shows the background-image, & it also shows the webpage without any spaces on the left or right, unlike IE when I can check my own website as the whole world would see it. So, I cannot troubleshoot this problem in my editor - so this problem really sucks!
I can't see any problems with the programming (code), so, could there be any problems with the main.css or style.css files? Can they be edited? Cos I think I just copied them from somewhere to start with.
QUOTE(ken- @ Dec 14 2011, 08:05 PM)
Actually, whenever I tried to change the first line to something else, after clicking on save in my html editor, it always reverts back to
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
Actually, the xmlns stuff in the HTML tag has nothing to do there in a HTML document.
QUOTE
So, my choice is either I have it, or not - if I delete it, it stays deleted.
You changed it once, didn't you? Your two pages have different doctypes. Isn't that what this is about? If your editor doesn't behave, use another one. Do it in Notepad if nothing else.
QUOTE
My question is, can anyone not see the differences between my 2 websites?
Of course we can. We are trying to explain to you that this is because of the different doctypes, because they trigger different rendering modes in browsers.
QUOTE
How can I preview using a browser? You mean something like IE or Firefox?
Yeah, something like that. Just open the HTML document in the browser as you would any document in any program. Drag it there or use File menu.
QUOTE
I can't see any problems with the programming (code)
There are problems. There are programs that can help you to find the errors in your HTML
http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes
and CSS.
http://jigsaw.w3.org/css-validator/validat...ng=&lang=en
The CSS checker shows you the probable reason to why your backgrounds don't show up.
CODE
BACKGROUND-IMAGE: url(Weight loss - Health Directory_files/out.gif)
That URL isn't correctly formatted. Spaces aren't allowed in URLs and must be escaped (replaced with special code). Instead of a space you use %20 like so.
CODE
background-image: url(Weight%20loss%20-%20Health%20Directory_files/out.gif);
This is called URL encoding. It's much easer (and prettier to read) to avoid spaces in file and directory names. Use underscore or hyphen if you want to separate words. Also, mixed case will usually get you into trouble sooner or later. Most servers are Unix/Linux based and unlike Windows they are case sensitive.
OK, thanks, it was the directory name spacing problem which prevented background-image from showing. My Pagebreeze html editor should've picked it up but didn't.
Anyway, I now wish to add more advertisements on the right hand side. How should I do it? Can I just do <div id="rightcol"> and add code after that?
Also, can you have a look at myhealthreporter.com/directory and see all the green boxes? Where do they come from? Cos I can't get those green boxes onto my website!
Anyway, I now wish to add more advertisements on the right hand side. How should I do it? Can I just do <div id="rightcol"> and add code after that?
Also, can you have a look at myhealthreporter.com/directory and see all the green boxes? Where do they come from? Cos I can't get those green boxes onto my website!
QUOTE(ken- @ Dec 14 2011, 09:27 PM)
Also, can you have a look at myhealthreporter.com/directory and see all the green boxes? Where do they come from? Cos I can't get those green boxes onto my website!
I did't check the CSS but they are probably background images.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.