Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What does "<html xmlns="http://www.w3.org/1999/xhtml">" do?

Tags:

html

css

xhtml

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?!

like image 625
good_evening Avatar asked Apr 29 '11 23:04

good_evening


People also ask

What is xmlns used for?

An XML namespace is a collection of names that can be used as element or attribute names in an XML document. The namespace qualifies element names uniquely on the Web in order to avoid conflicts between elements with the same name.

What is w3 Org in HTML?

W3C HTML. https://html.spec.whatwg.org/multipage/ is the current HTML standard. It obsoletes all other previously-published HTML specifications.

What XHTML means?

XHTML stands for EXtensible HyperText Markup Language. XHTML is a stricter, more XML-based version of HTML.


Video Answer


1 Answers

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.

like image 141
Richard JP Le Guen Avatar answered Sep 25 '22 23:09

Richard JP Le Guen