CSS Firefox Problem (Float I think!)

**Banfa** · Apr 12 '06, 02:47 PM

Ok part of the problem is that you have set your layout using IE, however your DOCTYPE,
[html]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">[/html]
is wrong it should be
[html]<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">[/html]

Because you have the doctype wrong IE runs in quirks mode and uses the broken box model of IE 5. You have adjusted your layout to work in IE using this broken box model so when you display it in a browser that uses the correct box model it looks wrong.

W3C infomation on DOCTYPEs here http://www.w3.org/QA/2002/04/valid-dtd-list.html

However that is not the only problem, if you want you code to work in standards complient browsers then you need to write standards complient HTML, use the W3Cs validator to check this here

The W3C Markup Validation Service

http://validator.w3.org/

W3C's easy-to-use markup validation service, based on SGML and XML parsers.

You have over 100 errors in your page.

The mix you have of tables and CSS for layout is very very confusing I would use 1 or the other (personally I would use CSS for main layout and only use tables for what they where intended, small items of related data as in a data table).

And finally you are experiencing a "float" problem which can be eased by using the css property "clear" (see help here http://www.w3schools.com/css/pr_class_clear.asp ) this property lets you specify that the element with it does not have any floating elements to it's left or right.

I would take these steps

Correct your DOCTYPE
Validate your HTML and fix all errors
Redesign your layout making it simpler

I might do 2 and 3 the other way round.

**kevinkilroy** · Apr 12 '06, 02:53 PM

thank you very much, I will begin straight away...

**PGScannell** · Jul 24 '06, 05:22 PM

I find it interesting that Firefox doesn't load the .css file, which I am also experiencing at my website, and the answer is to make the site w3c compliant?

What does that have to do with Firefox's inability to load a .css file? We're talking about loading it and intrepreting the valid css styles, not whether depricated tags are being used or </tr> tags are found without an initial <tr> tag.

There is something seriously wrong with Firefox if it can't load a file.

Would someone try to answer the load question by itself? There must be something in the syntax of the load; path referencing; slash orientation (\ vs /) Something that we can use to solve what is becoming a big problem in several posts.

Thanks,
Paul

**Banfa** · Jul 25 '06, 07:58 AM

Originally posted by PGScannell

I find it interesting that Firefox doesn't load the .css file, which I am also experiencing at my website, and the answer is to make the site w3c compliant?

I have not said that Firefox does not load the file, I have said that if you do not follow the standards then you will have trouble making the various browsers all interperate the HTML and CSS in the same way.

The best (well only) way to get good cross browser support is to write standard compilient code as they will all be able to interperate it and they will (mainly) all interperate it in the same or very similar way.

If you do not follow the standard (and if fact a hanging open tag rather than a spurious closing one is harder to deal with) or have code with mistakes in it then you are likely to set-up a situation where the browser can not tell which style you want applied to which element.

One of the main reasons for this standardisation is to make the browsers job simpler, the rules are set in stone (as it were) and are relatively easy to follow if the standards are being followed. Before the standards all the different browsers basically had there only slightly different version of HTML and IE5 was particularly bad since it used it's own slightly different version of CSS standard.

I can not stress enough that the only way to get good HTML and CSS working in multiple browsers is to follow the standards and that once you get in the habit this is not very hard to do(and that there are untilities to help you convert your current code although sometimes these can make a big mess of things).

You should always

Use a valid doctype
Validate your html

**jmonit** · Aug 21 '06, 10:20 AM

Hello there,

I am facing a problem with Css float. it doesnt seem to work in firefox can you help me out

heres my URL

http://www.freeezdeesi gns.com/monit/even/index.html

Looking forward to your reply

Best Regards

Monit

CSS Firefox Problem (Float I think!)

CSS Firefox Problem (Float I think!)

Comment

Comment

Comment

Comment

Comment