Page 1 of 1

css in firefox (fluidity issue)

Posted: Fri Jun 23, 2006 11:57 am
by $var
hello,
i've built a nice acting page in css, but i am not experienced enough to know the little tricks that could help with broswer differences.

i have this site: http://www.honeycombconnect.com/rd/ and it's perfect in IE, but if you minimize the window in FF one of the divs drops below instead of squeezing. basically, it's fluid in IE and not in FF.

anyone have a tip on how to get firefox to squish instead of drop down?

Posted: Fri Jun 23, 2006 2:03 pm
by Roja
In a nutshell, you are sending *incredibly* non-compliant code to a browser, and by your doctype, telling it to use strict mode for its rendering.

The results are not going to be good.

Step 1 if you want a working, consistent solution across browsers is to fix the html compliance issues.

http://validator.w3.org/check?verbose=1 ... om%2Frd%2F

Posted: Fri Jun 23, 2006 4:48 pm
by RobertGonzalez
Yeah, 515 XHTML validation errors might have something to do with it. It is a nice, visually appealing design. I couldn't get it to do what you were talking about (I resized to 800X600), but like Roja said, work the compliance issues out first, then style it for complete compliance.

Posted: Fri Jun 23, 2006 5:34 pm
by AKA Panama Jack
Actually most of those errors aren't really errors. W3C wants all tags and attributes to be lower case even though browsers are case-insensitive where tags and attributes are concerned. So a line with <INPUT ... is throwing a validation error even though it really is correct syntax.

Personally, I think requiring lower case for tags and attributes is being more than a little anal. It might have some relevance if an upper case version of INPUT performed different actions compared to a lower case version.

Also, the W3C validator has problems with javascript inside the page being validated. It will throw errors on valid javascript when it SHOULD be either validating it correctly or bypassing everything inside <script></script> tags.

A good example of the validator failing is this...

Code: Select all

Warning Line 67 column 12: character "&" is the first character of a delimiter but occurred as data.
	if ((isMac && isIE5 == 5)) {

This message may appear in several cases: 
You tried to include the "<" character in your page: you should escape it as "<"
You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&", which is always safe.
Another possibility is that you forgot to close quotes in a previous tag.
If you changed it as the validator indicates it will fail to work properly. If you strictly follow the advice the W3C validator gives then many times your page will not work right in any browser.

Posted: Fri Jun 23, 2006 6:45 pm
by Benjamin
I'm anal about using lowercase tags, and I tend to go out of my way to convert them when working on code written by other people, but I'm not sure it should be a requirement.

Posted: Fri Jun 23, 2006 7:16 pm
by Roja
AKA Panama Jack wrote:Actually most of those errors aren't really errors.
You misspoke. They are errors in compliance to the W3c standards.

They may not be errors you care about, agree with, or feel are worthwhile to fix, but they are errors in compliance to the W3c standard.
AKA Panama Jack wrote:W3C wants all tags and attributes to be lower case even though browsers are case-insensitive where tags and attributes are concerned.
Again, your phrasing is off. W3C doesn't "want" anything. The standard, for the specific type of html that the author chose as his doctype requires lowercase tags.

He is in control. He can choose another doctype if he doesn't like case-sensitivity - like HTML transitional.
AKA Panama Jack wrote:So a line with <INPUT ... is throwing a validation error even though it really is correct syntax.
For the doctype the author chose, it is NOT correct syntax.
AKA Panama Jack wrote:Personally, I think requiring lower case for tags and attributes is being more than a little anal. It might have some relevance if an upper case version of INPUT performed different actions compared to a lower case version.
Argue with the standards body before the standards are released, or choose another doctype. However, please be accurate in your statements. The doctype chosen on the page requires lowercase tags. $var chose that doctype - he is choosing to be that rigid. He can alternatively choose HTML transitional, which is very loose in what it will accept.
AKA Panama Jack wrote:Also, the W3C validator has problems with javascript inside the page being validated. It will throw errors on valid javascript when it SHOULD be either validating it correctly or bypassing everything inside <script></script> tags.
Sorry, here again, if it was a different doctype, I would agree. (Notably, it has the same problem on html-trans pages, and it shouldn't. Then it would be a valid argument). But in XHTML, the javascript should live outside the document - not inside.
AKA Panama Jack wrote:If you changed it as the validator indicates it will fail to work properly. If you strictly follow the advice the W3C validator gives then many times your page will not work right in any browser.
Or, if you clicked the explanation, it goes into detail to explain that it commonly runs into this situation with authors improperly embedding javascript in an XHTML page.

If you ignore the requirements of the DTD you choose, then many times, your page will not work right in any browser either.

Re: css in firefox (fluidity issue)

Posted: Fri Jun 23, 2006 7:20 pm
by Roja
$var wrote:anyone have a tip on how to get firefox to squish instead of drop down?
In further looking at it, I'm not seeing different behavior between the two browsers now.

Mind giving more detail about what the difference in rendering is?