I'm playing around with the doctypes to find the best one for me. I'm thinking about to use XHTML 1.0 strict, because it shouldn't accept the deprecated elements and attributes.
To test the behaviour, I created an html page with the following content:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<div align="center">
Some Text
</div>
</body>
</html>
When I open this with Firefox the div has 100% width (which is ok) and it's text is aligned to center (which is not ok, the align attribute isn't supposed to work anymore).
Can someone explain why this is happening? Am I doing something wrong or are some deprecated attributes still accepted in strict mode?
Doctype switching triggered Standards Mode has nothing to do with enforcing lack of support for deprecated/removed attributes. Most of the effects it has are on disabling the emulation of bugs (such as incorrect handing of width and assuming integer values are pixel values) in CSS support.
Use a validator to detect when you are using a deprecated HTML feature.
Related
I am building a website with a Google Map, which by default generates this code:
<iframe width="550" height="500" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&q=Amber,+115+Portswood+Road,+Southampton,+SO17+2FX,+United+Kingdom&aq=0&sll=50.923556,-1.394663&sspn=0.006709,0.01929&vpsrc=6&ie=UTF8&hq=Amber,&hnear=115+Portswood+Rd,+Southampton+SO17+2,+United+Kingdom&t=m&ll=50.923178,-1.393676&spn=0.012985,0.027466&z=15&output=embed"></iframe><br /><small>View Larger Map</small>
Now this throws an error when checked for XHTML Strict, as it is Frames which are outdated, but what should I use instead?
Thanks for the help
If you must have a Maps iframe on your page, the easiest solution is to change your doctype to XHTML 1.0 Transitional instead, which permits the use of iframes:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
However if you start to see any differences in page rendering (see standards mode vs almost standards mode), and you're more concerned about how your site looks in web browsers than validating your markup, just keep the XHTML 1.0 Strict doctype. Browsers won't error out simply because a page is invalid XHTML; they'll handle your iframe just fine either way.
There exists a dirty trick with Javascript:
function load()
{
document.getElementById("ramec").innerHTML = '<iframe class="ramec"></iframe>';
}
and:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs" lang="cs">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="yourjshere.js">
</script>
<title></title>
</head>
<body onload="load()">
<div id="ramec">
</div>
</body>
</html>
The document in the first link validates as XHTML1.0 Strict, although it uses iframe inside (try the links inside the document). The important part is that Javascript which puts iframe into the document is external.
I'm not sure if it worth all the effort. Maybe changing to HTML4.1 Strict document type would be much more helpful there (the rendering of page would be the same as with XHTML1.0 Strict).
An object tag performs the same function, no hacks required. Just change the "src" attribute to "data" and add type="text/html".
<object width="550" height="500" data="http://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&q=Amber,+115+Portswood+Road,+Southampton,+SO17+2FX,+United+Kingdom&aq=0&sll=50.923556,-1.394663&sspn=0.006709,0.01929&vpsrc=6&ie=UTF8&hq=Amber,&hnear=115+Portswood+Rd,+Southampton+SO17+2,+United+Kingdom&t=m&ll=50.923178,-1.393676&spn=0.012985,0.027466&z=15&output=embed" type="text/html"></object>
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
Are self-closing tags valid in HTML5?
For example:
<div id="myDiv" />
Something would then be done to populate this div using Javascript.
Is this valid HTML?
No. HTML 4.x doesn't have any concept of self closing tags.
It is valid in XHTML.
Div's are not valid self closing tags. To have an empty div it would be better to do this:
<div id="myDiv"></div>
According to the XML declaration and the XHTML 1.0 and 1.1 document definitions, this is fine: the null-end tag (>) may be used when immediately following the null-end start tag closer (/), and your code is equivalent to <div id="myDiv"></div>.
It's a different matter entirely whether any particular consumer will be able to process this correctly.
The SGML declaration used by HTML 4.01 allows tag shortening, but it has a different syntax for the null-end tags; there you can write <div id="abc"/this is a non-empty div/. Again, mileage may vary as for browser support. (My money is on "none".)
Future versions of HTML (HTML5? if that name is still alive) are no longer implemented as SGML languages, and therefore they simply allow what they say they do, without recourse to a formal grammar.
I ran these two blocks of code through the W3C validator. Copy and paste the code into the input under the Validate by Direct Input tab to see the results for yourself.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>title</title>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" >
</head>
<body><div id="Mydiv" /></body>
</html>
The code block with Doctype of transitional HTML 4.01 failed the validation process.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title>Test</title>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
</head>
<body><div id="Mydiv" /></body>
</html>
When I added the XHTML 1.0 transitional doctype, changed the meta tag to a self closing tag, and added in the html xmlns line, the validation passed.
So to answer the first half of your question, it is valid HTML under the XHTML 1.0 Transitional doctype. Whether or not you can use javascript to properly populate it, I am not sure.
Self Closing Tags in XHTML as implemented by browsers:
What are all the valid self-closing elements in XHTML (as implemented by the major browsers)?
Self Closing tags in html5:
Are (non-void) self-closing tags valid in HTML5?
No, it's valid XML (not HTML), and as far as I know, will only be accepted if the document is send with an application/xml mimetype.
However, it may work with XHTML, and the XHTML Doctype declaration.
I am working on this personal project and the sign-in screen of the website goes completely haywire in IE-9
Can someone please suggest me how can I fix it? The webpage is at
http://www.ayeboss.com/users/login
Try opening it in FF and IE and you will see the difference.
Any inputs will be highly appreciated
Your page is being displayed in Quirks Mode, because you don't have a doctype.
Add this, the HTML5 doctype, as the very first line to resolve the problem:
<!DOCTYPE html>
You should always add a doctype to trigger Standards Mode.
well some problems with your html and some with CSS. you are trying to use CSS3 but not completly..
1st mention DOCTYPE
2nd margin and paddings are bugy in IE.. in IE the become double to normal value.
(i.e like if you set margin for Fireforx but they appear double in IE most likly.)
3rd you have use CSS3 properties ..
-moz-border-radius (it only works in FF) so if you want to see this property in action in IE .. try -webkit-border-radius. and read this article border-radius
for gradient gradient
replace your html tag with this
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
If you are using html transitional use this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
If you are using XHTML 1.0 transitional go for this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
If you never want your browser to behave as an old version. Then add this:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
I can't believe what is happening in my website. When I add this line:
<html xmlns="http://www.w3.org/1999/xhtml">
<!DOCTYPE html>
<html>
<head>
Everything works fine. And when I don't, CSS "messes" up, everything becomes different and layout becomes "ugly".
How can this line solve all the problems?!
You're mixing up HTML with XHTML.
Usually a <!DOCTYPE> declaration is used to distinguish between versions of HTMLish languages (in this case, HTML or XHTML).
Different markup languages will behave differently. My favorite example is height:100%. Look at the following in a browser:
XHTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style type="text/css">
table { height:100%;background:yellow; }
</style>
</head>
<body>
<table>
<tbody>
<tr><td>How tall is this?</td></tr>
</tbody>
</table>
</body>
</html>
... and compare it to the following: (note the conspicuous lack of a <!DOCTYPE> declaration)
HTML (quirks mode)
<html>
<head>
<style type="text/css">
table { height:100%;background:yellow; }
</style>
</head>
<body>
<table>
<tbody>
<tr><td>How tall is this?</td></tr>
</tbody>
</table>
</body>
</html>
You'll notice that the height of the table is drastically different, and the only difference between the 2 documents is the type of markup!
That's nice... now, what does <html xmlns="http://www.w3.org/1999/xhtml"> do?
That doesn't answer your question though. Technically, the xmlns attribute is used by the root element of an XHTML document: (according to Wikipedia)
The root element of an XHTML document must be html, and must contain an xmlns attribute to associate it with the XHTML namespace.
You see, it's important to understand that XHTML isn't HTML but XML - a very different creature. (ok, a kind of different creature) The xmlns attribute is just one of those things the document needs to be valid XML. Why? Because someone working on the standard said so ;) (you can read more about XML namespaces on Wikipedia but I'm omitting that info 'cause it's not actually relevant to your question!)
But then why is <html xmlns="http://www.w3.org/1999/xhtml"> fixing the CSS?
If structuring your document like so... (as you suggest in your comment)
<html xmlns="http://www.w3.org/1999/xhtml">
<!DOCTYPE html>
<html>
<head>
[...]
... is fixing your document, it leads me to believe that you don't know that much about CSS and HTML (no offense!) and that the truth is that without <html xmlns="http://www.w3.org/1999/xhtml"> it's behaving normally and with <html xmlns="http://www.w3.org/1999/xhtml"> it's not - and you just think it is, because you're used to writing invalid HTML and thus working in quirks mode.
The above example I provided is an example of that same problem; most people think height:100% should result in the height of the <table> being the whole window, and that the DOCTYPE is actually breaking their CSS... but that's not really the case; rather, they just don't understand that they need to add a html, body { height:100%; } CSS rule to achieve their desired effect.
Its an XML namespace. It is required when you use XHTML 1.0 or 1.1 doctypes or application/xhtml+xml mimetypes.
You should be using HTML5 doctype, then you don't need it for text/html. Better start from template like this :
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>domcument title</title>
<link rel="stylesheet" href="/stylesheet.css" type="text/css" />
</head>
<body>
<!-- your html content -->
<script src="/script.js"></script>
</body>
</html>
When you have put your Doctype straight - do and validate you html and your css . That usually will sove you layout issues.
It sounds like your site has CSS or JS that depends on running in quirks mode. Which is why you need garbage above your doctype to render "correctly". I suggest removing said garbage and then fixing your CSS+JS to actually work in standards mode; you'll save yourself a lot of pain in the long run.
The namespace name http://www.w3.org/1999/xhtml
is intended for use in various specifications such as:
Recommendations:
XHTML™ 1.0: The Extensible HyperText Markup Language
XHTML Modularization
XHTML 1.1
XHTML Basic
XHTML Print
XHTML+RDFa
Check here for more detail
is it possible to use DOCTYPE tag in line 2 or 3 or ... and css works good ? (not line 1)
tag :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Yes. As long as it comes before your <html> tag, you should be fine. This might happen, for instance, if you put an XML declaration above it. The xml declaration, however, must occur at the very beginning of the file.
Example:
<?xml version='1.0' charset='utf-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>This is an example</title>
</head>
<body>
<h1>This is an example</h1>
<p>
You might even put an xml stylesheet declaration up above your
DTD declaration, which would look like this:
<code><?xml-stylesheet type="text/xsl" href="transform.xsl"?></code>
</p>
<p>But you still can't put any HTML above your DOCTYPE. Sorry.</p>
</body>
</html>
Seems like you are very persistent about doing strange things with your doctype. It's best you always use it AND put it on the first line of your document. If you go arround the web you'll find that almost every website has it like that.
Is there a reason why you don't want to do so?
IE6 will fall into quirks mode if you put anything (including an XML declaration) before the Doctype. So - "no".
Most browsers will fall into quirks mode (AFAIK) if any content appears before it. Don't use hosts who prevent you from using valid markup.
by standards, the DOCTYPE should be the first line. why would you not want to put it there anyways?