PDA

Click to See Complete Forum and Search --> : Starting with xHTML

Znupi
09-12-2007, 06:08 PM
I know HTML pretty good, but I want to start learning xHTML. Now, I've read the basics of it and I started writing a page template (to get some exercise) in xHTML. I've come up with this:

<!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="en" lang="en">
<head>
<title>Template 1</title>
<style type="text/css">
@import url('files/styles.css');
</style>
<meta http-equiv="Content-Type" content="text/xhtml; charset=UTF-8" />
</head>
<body>
<div class="topBar" />
<div class="wrap">
<div class="header">
<span class="cName">Company Name</span>
<span class="cSlogan">Company Slogan</span>
</div>
</div>
</body>
</html>

I have validated it and it is valid. The thing is, I think Firefox (and Opera) somehow don't render it as xHTML, because <div class="wrap"> appears inside <div class="topBar">. Can someone enlighten me? Why is this happening? :(
WebJoel
09-12-2007, 06:23 PM
I don't see any probs...
(notice your sig... looks rather like mine!) :D
Znupi
09-12-2007, 06:27 PM
Yeah sort of similar :P (only I use 1280x1024 :D).

So... any ideas why Firefox thinks <div class="wrap"> is inside <div class="topBar" />? It shouldn't be because I closed it with />, right?
WebJoel
09-12-2007, 06:31 PM
I prefer to use "</div>" in case I added something via the HTML. But if you are adding everything via the CSS, that shouldn't matter, -right? :confused: I suppose if "~ />" is not being recognized, then yes, it would act like a 'wrapper' and swallow everything up to the closing "</html>". That is does in fact have a qualified closure " />", the omitted close error is not reported(??).
Znupi
09-12-2007, 07:01 PM
Okay... this time in english :D.
No really, I didn't understand. Is it supposed to be this way?
dtm32236
09-12-2007, 08:37 PM
close your divs like:

<div class="whatever"></div>

not <div class="whatever" />



<!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="en" lang="en">
<head>
<title>Template 1</title>
<style type="text/css">
@import url('files/styles.css');
</style>
<meta http-equiv="Content-Type" content="text/xhtml; charset=UTF-8" />
</head>
<body>
<div class="topBar">
<div class="wrap">
<div class="header">
<span class="cName">Company Name</span>
<span class="cSlogan">Company Slogan</span>
</div>
</div>
</div>
</body>
</html>
Centauri
09-12-2007, 08:59 PM
Is there any point? Xhtml is supposed to be served as application/xhtml, but if it is then IE will prompt for a download due to IE not supporting xhtml. You can serve it as text/html, but then as far as the browser is concerned, it is html, so why not declare it as html?
ray326
09-12-2007, 11:09 PM
So... any ideas why Firefox thinks <div class="wrap"> is inside <div class="topBar" />? It shouldn't be because I closed it with />, right?How do you know that Fx thinks wrap is inside of topBar? You're right about the syntax. Could be a parsing bug in Fx.
Kravvitz
09-13-2007, 12:23 AM
I agree with Centauri, but I'll try to explain this for you guys.

Ray, it's not a parsing bug in Fx, as you put it (the official abbreviation for Firefox, though I usually use the more common "FF" myself.).

Firefox was using its HTML parser, not its XML parser.

For the XML parser to be used, you must use an XML mime-type, which include application/xml, application/xhtml+xml (the preferred one for XHTML), and text/xml (which is deprecated because it requires the charset to be US-ASCII). More information. (http://www.w3.org/TR/xhtml-media-types/)

There is no such thing as text/xhtml. Apparently it was proposed for use, but they decided on application/xhtml+xml instead.

The mime-type in a <meta http-equiv="Content-Type" ...> element is usually ignored. When the document is served via a web server, assuming the web server includes the content-type field in the HTTP headers, that mime-type will be the one used. When you open the file locally, some browsers will use the default mime-type for the file extension instead of what's specified in that element.

If you serve an XHTML 1.0 document as text/html, you should follow the HTML compatibility guidelines specified in appendix C (http://www.w3.org/TR/xhtml1/#guidelines). (XHTML 1.1 must be served with an XML mime-type.)

<div /> only works when you use an XML parser. In HTML and HTML compatible XHTML 1.0, you should use <div></div>. There is a bug in most HTML parsers such that they will ignore the slash in empty elements, which include <img>, <br>, <hr>, <link>, and <meta>.

If you have any questions feel free to ask.

P.S. Using single-quotes in that @import rule will cause IE5/Mac to ignore it.
Emerick
09-13-2007, 12:53 AM
the only time you want this:

<tag />

is when you have a non closing tag like <br> <hr> etc... so,

<br />
<hr />

This is because in XHTML you always need to close your tags.
ray326
09-13-2007, 10:23 PM
Ray, it's not a parsing bug in Fx, as you put it (the official abbreviation for Firefox, though I usually use the more common "FF" myself.).I try to call things the name the people that created them want them called. That's why it's "jiff", not "gif" as in "gift". :)

Firefox was using its HTML parser, not its XML parser.Ah. That makes sense. Thanks for the heads up.
ray326
09-13-2007, 10:24 PM
non closing tagActually it's an "empty" tag. As you say, they ALL close.
Znupi
09-14-2007, 12:29 PM
So the way to fix it would be to set the server to send application/xhtml+xml as Content-Type? But then I guess IE would ask to save, right?...
Stephen Philbin
09-14-2007, 12:48 PM
Yup. That's why it's usually best to save using XHTML for when you actually have a use for it. Most folks seem determined to use XHTML just for the sake of it, but it's not a particularly good idea.

It's an excellent starting point for learning about XML, though.
kiwibrit
09-14-2007, 01:40 PM
Plus ça change, plus c'est la même chose (http://hixie.ch/advocacy/xhtml).