Rough Book

random musings of just another computer nerd

Tag: xhtml compliance

This site is XHTML 1.1 Valid

I finally got this site to validate! The folks over here were really helpful, and pointed out that I wasn’t assigning values to my objects’ style attributes properly. For example, I was doing:

obj.style.width = 200;

instead of:

obj.style.width = "200px";

The second way is the correct way because it is important to specify units for your attributes. In addition, Firefox won’t parse it because it’s very strict about XHTML and CSS. Furthermore, certain things weren’t where I expected them to be. I was used to writing:

obj.style.height = document.body.scrollHeight;

But that no longer worked (the value being returned was 0). The method that works now is:

obj.style.height = document.body.parentNode.scrollHeight + "px";

You have to add in that “px” because the scroll height doesn’t have any units. Once I made these changes, the site started working and validating perfectly. Thanks a bunch to all those who helped!

I guess I did most of this just to jump on the bandwagon and because it did have a “geek” factor. But eitherway, since my website adheres to the standards now, I can be reasonably sure that it looks like the way it should… except for IE though. IE lets you get away with almost anything, and that’s why 90% of the websites out there have such terrible code. IE is very forgiving and can recover from bad HTML, but that only encourages sloppy coding. But anway, now that my site validates, I can proudly display the W3C’s “Valid XHTML 1.1” icon!

Live! Preview and XHTML Compatibility

I’ve added a new feature called “Live Preview”. You can see your comment as it will appear, right as you type it. I randomly just came up with the idea yesterday – I figured I could use the same code I have in place for the preview, for the Live Preview as well. I just trap the onkeyup event for the textarea. It works pretty well. Of course, there is a lag, but it’s not too bad. Oh yeah, I also removed the numbers in the comment list and replaced them with little blurbs that I made. The blurbs won’t show correctly in IE, because IE is stupid and doesn’t handle PNG transparencies well.

Then there’s XHTML compatibility. I’ve been trying really hard to get this page to validate. I was finally able to get rid of all the errors. This page validates (if you set the DOCTYPE to XHTML 1.1 explicitly, but I’ll get to that later) without any errors, as does all the CSS. However, the problem comes when I add in the DOCTYPE. The page validates perfectly, but displays completely messed up in Firefox (IE can’t handle the mime type so I didn’t even bother checking it with IE). I tracked the problem down to the Javascript. Basically, I can’t set any DOM object attribute values from Javascript. It’s as if all attributes are read-only. It’s really quite bizarre. I’ve posted the problem on a message board, so we’ll see what happens. If any of you know why I could be facing this problem, please let me know.

Here’s what the DOCTYPE (and other information) looks like:

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

Also, I have a sandboxed version of the website here. You can see the problem directly there.

All original content on these pages is fingerprinted and certified by Digiprove
%d bloggers like this: