PDA

Click to See Complete Forum and Search --> : Doctype

chedder
11-27-2005, 10:37 PM
I wasn't really sure which thread to put this in but anyways...
When I went to validate my site (http://www.elemental-art.com/new/index.html) I realized that height isn't valid in the table tag. So I put it in the style, which works...until I try to add a DOCTYPE to the page. Then it completely ignores the height.
I tried the DOCTYPEs on this (http://www.alistapart.com/articles/doctype/) page but none work (I put a random one in there as an example since they all have the same effect). I also get a few other errors like the head tag isn't closed, but it is (perhaps it's a result of a different problem?).
So, if anyone can help me with the DOCTYPE I'd appreciate it. Thanks.
NogDog
11-28-2005, 12:20 AM
W3.org's list of recommended doctypes (http://www.w3.org/QA/2002/04/valid-dtd-list.html)

I applaud that your are using the validators and adding a doctype. Now the next step is to scrap the use of tables for visual presentation (that is not their purpose) and instead use CSS styling to achieve your layout.

Have fun! :)
chedder
11-28-2005, 12:07 PM
I got rid of the tables (http://www.elemental-art.com/new/index2.html) (the background colors are just there so I can see how everything fits). The only DOCTYPE that seems to work is the HTML 3.2 one. If I try the other DOCTYPEs they throw off all the dimensions. But when I went to validate I get a bunch of strange errors. Does it matter which one I use?
MstrBob
11-28-2005, 01:07 PM
I got rid of the tables (http://www.elemental-art.com/new/index2.html) (the background colors are just there so I can see how everything fits). The only DOCTYPE that seems to work is the HTML 3.2 one. If I try the other DOCTYPEs they throw off all the dimensions. But when I went to validate I get a bunch of strange errors. Does it matter which one I use?

Yes, very much. Do you know what a DOCTYPE is? It tells the browser what version of HTML you are using. If you are writing HTML 4.01 code (Which by all means you should be that is the language to use) and throw in a HTML 3.2 DOCTYPE, browsers will interpret the page as HTML 3.2. Not the intended result.

There differences you are experiencing are due to the fact that before browsers were defaulting to the older method of rendering your page. Which you should be avoiding, you should be using the HTML 4.01 Strict (Unless you are using Frames) and CSS.

In your case you're using IFRAMES (Which you should avoid, but that's another story). So you should use this DOCTYPE:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


And to make your IFRAME appear the way you want in IE (Which is quite the buggy browser) remove the height and width attribute from your iframe element.


<iframe src="http://www.elemental-art.com/new/main.html" frameborder="0" name="frame"></iframe>
NogDog
11-28-2005, 05:46 PM
Make sure you realize that when using a real browser, or using IE with a valid doctype, that the total width or height of a box equals the width or height specified in you CSS or style attribute PLUS the padding, margin, and border-width on each side. IE in quirks mode (not using a doctype) calculates those dimensions incorrectly (at least not according to the w3.org specifications), so IE will often have rather radical changes between versions with or without a doctype. Since doctype is a required HTML element, you should learn to design with it in place and account for it.
chedder
11-29-2005, 09:06 PM
So, I believe all the problems with the DOCTYPE are over. I put the iframe height/width attributes in the CSS. And everything validates well. Now the problem is IE. The page (http://www.elemental-art.com/new/index2.html) looks like it should in Firefox, but the height is completely ignored in IE. I've tried tweaking different parts of the CSS but nothing is doing the trick.

Any help with that would be greatly appreciated.
ray326
11-29-2005, 09:33 PM
I think you need to rethink your layout to eliminate the absolute positioning for floats, relative positions and clearing.