Firefox not rendering CSS and not running JS in XHTML

**vi5in** · 05-18-2005 12:48 PM

Hello,

This is my first post on this forum. I've been scouring the web for information regarding this, but I wasn't very successful.

What I have learnt so far is that Firefox is very strict when it comes to XHTML. I have some external CSS and JS files that I'm serving up. Initially I wasn't setting any headers in them. So I tried that, and they still don't render.

Basically, the site works fine without the XHTML DOCTYPE information. But I'm trying to get my site to be XHTML compliant and when I add the DOCTYPE information, it doesn't render properly in Firefox (Although IE seems to have no problem, but I understand that's because it's not as strict as FF).

Anyway, here is what I put at the beginning of the file:

HTML Code:

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

Once I add this, FF stops rendering the CSS and also stops running the JS.

For my CSS files I have the following:

PHP Code:


  <?php



   if($FIREFOX)

   {

      ?><link rel = "stylesheet" type = "text/css" href = "<?php echo $CSSBASE ?>/styles_ff.css.php" /><?php

   }



   else

   {

      ?><link rel = "stylesheet" type = "text/css" href = "<?php echo $CSSBASE ?>/styles_ie.css.php" /><?php

   }



  ?>



  <link rel = "stylesheet" type = "text/css" href = "<?php echo $CSSBASE ?>/styles_common.css.php" />

$CSSBASE contains the absolute path (with the whole URI) to my CSS files.

For my JS files, I have:

HTML Code:

  <script src      = "<?php echo $JSBASE ?>/general.js.php"
          type     = "text/javascript">

  </script>

  <script src      = "<?php echo $JSBASE ?>/index.js.php"
          type     = "text/javascript">

  </script>

$JSBASE is similar to $CSSBASE.

Once I remove the DTD information, the page renders fine. But as soon as I insert the DTD information, Firefox chokes on it.

The page doesn't validate properly under explicit XHTML 1.1 settings at the W3 Validator page. But if I set the DTD, it removes most of the validation errors, except some "<a> not supposed to be here, missing <li>" errors. I figure I will get to that later - but could that be the reason that FF is choking on it? Improper XHTML?

Thanks in advance.

**Charles** · 05-18-2005 02:28 PM

Please post the URL.

**vi5in** · 05-18-2005 02:44 PM

The URL is http://vivin.net

The version that's on right now is the one without the DTD information. It renders fine in Firefox.

**Charles** · 05-18-2005 02:57 PM

XHTML is very different from HTML and in XHTML an invalid or not well formed document is supposed to not render at all. Aside from those errors that you have mentioned, there is no IFRAME element and there is no "target" attribute.

And why on earth are you using XHTML in the first place? First learn to properly mark up the page in HTML.

For what you are doing, you'll need to use HTML 4.01 transitional but you aren't supposed to use TABLEs for layout and you need to mark up your headings as such.

**Fang** · 05-18-2005 03:05 PM

All your id's begin with a space which is not allowed!

**Charles** · 05-18-2005 03:13 PM

Originally Posted by Fang

All your id's begin with a space which is not allowed!

But doesn't the normalization process remove any leading and trailling white space?

**Fang** · 05-18-2005 03:28 PM

Classes are ok with spaces , but not id's

**vi5in** · 05-18-2005 04:05 PM

I don't have any spaces in any of my ID's. When you view the source with firefox, for some reason it inserts spaces.

I'm not sure what you meant by "You are not supposed to use tables for layout" - could you explain more?

I'm well aware that XHTML is quite different from HTML. If you insert the DTD, and then perform a validation with automatic detection, the IFRAME and TARGET errors disappear - why is that?

**vi5in** · 05-18-2005 04:10 PM

I could use something like this:

HTML Code:

<object type="text/html" data="http://www.google.com" width="400" height="500">
<p>Alternate text</p>
</object>

But that won't render in IE SP2.

How about using XHTML transitional? I'm just trying to move away from HTML into XHTML. I know my methods are not perfect, and I'm willing to learn so it's not necessary to take such a patronizing tone.

Thanks for the help.

**Charles** · 05-18-2005 05:18 PM

Why are you trying to use XHTML?

**Charles** · 05-18-2005 05:26 PM

From the HTML 4.01 Specification:

Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables.

**Charles** · 05-18-2005 05:27 PM

I downloaded a copy of your site without using a browser, and I see what your talking about. It is odd but let's start with a page that passes the validator first. It could be that some other error of yours is confusing Firefox.

**vi5in** · 05-18-2005 05:28 PM

It seems to me that everyone wants to move to something stricter, and less ambiguous. XHTML is much stricter than HTML (I'm sure you already knew that). I just want to use something that is more up-to-date - make sure that my code meets the standards.

What is your take on this? Is it worth transitioning over to XHTML? Or should I stay with 4.0 transitional?

**Charles** · 05-18-2005 06:07 PM

4.0 transitional, Good Lord, no!.

4.0 had a lot of problems and was replaced by 4.01 back on 24 December 1999. And we were supposed to stop using the transitional DTD when browsers started supporting CSS, something that happened a long time ago.

XHTML is fine for some applications but it is not compatable with HTML. Unless you are using its special features you ought to use HTML 4.01 Strict.

But if you do use XHTML then be certain to read and follow the compatability appendix to the XHTML 1.0 spec. and be certain to follow the 4.01 specification.

**Robert Wellock** · 05-19-2005 04:36 AM

If you use XHTML then you might aswell send 'application/xhtml+xml' for those UA that can accept it.

Thread: Firefox not rendering CSS and not running JS in XHTML

Thread Tools

Display

Firefox not rendering CSS and not running JS in XHTML

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions