...

View Full Version : Firefox blues



CaptainB
07-08-2007, 12:48 PM
Yup, I'm using IE as default and I know that I should code for FF, but that's too late now.

I recently downloaded Firefox 2 to test out my site in it.
It looks good, however there are some problems.

1: The border around the whole layout is missing in FF. <-- PROBLEM FIXED!
2: My drop-out menu dosn't display in FF (a javascript): <-- PROBLEM FIXED!

3: Does IE and FF handle padding different? On this box I have set 5px padding to top, bottom and left. <-- PROBLEM FIXED!

How would I come around these probs?

koyama
07-08-2007, 12:57 PM
We really need to see the code in order to tell what the problem is. A link would be even better.

CaptainB
07-08-2007, 12:58 PM
Oh, sorry :o : http://www.xflightx.port10.com/test/main-layout.php

koyama
07-08-2007, 01:08 PM
1: The border around the whole layout is missing in FF.
A floated element should not by default expand its parent. In IE, due to a bug, it does anyway if the parent hasLayout (http://www.satzansatz.de/cssd/onhavinglayout.html) such as the case is when an explicit width of height is specified. That is why your #container has zero height in Firefox (but not in IE6/7).

My favorite method for float containment is using overflow: hidden (http://www.quirksmode.org/css/clearing.html)


#container {
width:981px;
margin-left:auto;
margin-right:auto;
border-style:solid;
border-width:1px;
border-color:#000000;
overflow: hidden;
}

CaptainB
07-08-2007, 01:11 PM
Ahh, that explains it. Thanks, it works with overflow:hidden; :thumbsup:

koyama
07-08-2007, 01:26 PM
2: My drop-out menu dosn't display in FF (a javascript)
This is actaully a JavaScript question. Anyway it looks like the script is broken. I don't know what this line is doing?


var ns6=document.getElementById&!document.all
I have never heard about the &! operator? Perhaps there is something that I missed. In the mean time try to change that line to this:


var ns6=document.getElementById && !document.all

CaptainB
07-08-2007, 01:36 PM
Wow, that's strange! I had never noticed that, don't know why it was missing. But it fixed my problem to add an extra "&".

Again, thank you for your great help!

koyama
07-08-2007, 01:39 PM
3: Does IE and FF handle padding different? On this box I have set 5px padding to top, bottom and left.
The problem seems to be the default margin for the form.

The browsers default margin around the form element varies depending on where the form is placed in the source. There are differences between IE and FF. Then again, quirks mode is different too.

It is probably a good idea to reset the form margin:


form {
margin: 0;
}

CaptainB
07-08-2007, 01:45 PM
Holy moly!! I never knew that there was a tag to reset form margins! Wow!

Thanks, problem fixed!!! :thumbsup: :thumbsup:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum