...

View Full Version : website screwed up in FF 3.6



skywalker89
07-09-2011, 12:10 AM
Hi,

just learning that my website does not siplay well in some old browsers...

I have no idea why ie. FF 3.6 distorts my website soo much

my website is Home of Solar Energy (http://www.homeofsolarenergy.com)

And this is hoe FF 3.6 on XP displays my website...
And IE 7 is not nice either

help please!! :confused:

Thank you

Daniel

sunfighter
07-09-2011, 07:37 AM
I was going to say "Who uses FF 3.6?" and thought better of it and went and validated your site. When a site does not work in a browser (outside of IE) it normally means it's not programmed correctly. You have over 70 errors.

Go to: http://validator.w3.org/ and fix these errors and thing probably will work.

Major Payne
07-09-2011, 07:54 AM
FF 3.6 is not that old even if FF 5 is out. Some people's add-ons break with new version and it's better to use the latest old versions until add-on developers correct the problems. With FF, it shouldn't matter anyway as to how a page looks with an old version as errors in CSS and HTML are enough to cause problems. FF does not like bad code and will parse your pages as you have coded it.

CSS errors (http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Fwww.homeofsolarenergy.com%2F). Ignore the text shadow and radius stuff. Just correct the others.

72 HTML errors (http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.homeofsolarenergy.com%2F)

skywalker89
07-09-2011, 09:32 AM
Hi sunfighter and Major,

thank you so much!! Sorry for these beginner level questions..

I already have asked in another thread (sorry for that), how can I know and decide or who does??) what version of CSS is computed/assumed?

And what is meant here?

290 .Navigation a:hover Property text-emphasis doesn't exist : accent accent

And - again sorry - why can I leave out the
the text shadow and radius stuff?

Is that also about CSS 2 and 3??

Thank you so much (will not be my last one, as I am sitting in fron of these W3 comments scratching my head ;) :confused:

Daniel

vikram1vicky
07-09-2011, 10:35 AM
Hi sunfighter and Major,

thank you so much!! Sorry for these beginner level questions..

I already have asked in another thread (sorry for that), how can I know and decide or who does??) what version of CSS is computed/assumed?

And what is meant here?


And - again sorry - why can I leave out the ?

Is that also about CSS 2 and 3??

Thank you so much (will not be my last one, as I am sitting in fron of these W3 comments scratching my head ;) :confused:

Daniel



Hello,


In our coding, we dont have to define which version of CSS we are using, but while validating our CSS code on http://jigsaw.w3.org/css-validator/ we should select CSS profile...

Let me know if you want more clarification :)

Cheers :)

skywalker89
07-09-2011, 11:00 AM
Hi vikram,

thank you ...

hmmm... so it is my decision if I use CSS 2 or 3??

and do I assume correctly that it is more likely that CSS 3 creates errors on browsers than CSS 2?

Again, thank you :)

Daniel

skywalker89
07-09-2011, 11:19 AM
Hi, next one: why is that wrong??


346 .ExtraNav a:link Property -moz-border-radius doesn't exist : 3px 3px (even with CSS3 ??????? )
342 .ExtraNav a:link Property -moz-border-radius doesn't exist : 3px 3px
342 .ExtraNav a:link Property -khtml-border-radius doesn't exist : 3px 3px
342 .ExtraNav a:link Property -webkit-border-radius doesn't exist : 3px 3px
357 .ExtraNav a:visited Property -moz-border-radius doesn't exist : 3px 3px
357 .ExtraNav a:visited Property -khtml-border-radius doesn't exist : 3px 3px
357 .ExtraNav a:visited Property -webkit-border-radius doesn't exist : 3px 3px

w3schools says this:

Internet Explorer 9 supports some of the new border properties.
Firefox requires the prefix -moz- for border-image.
Chrome and Safari requires the prefix -webkit- for border-image.
Safari also needs the prefix -webkit- for box-shadow.
Opera supports the new border properties.

seems to be ok...why does W3 Validator complain? :eek:

Thanks

Daniel

vikram1vicky
07-09-2011, 11:21 AM
Daniel,

No dear :)

1st of all you have to learn, which CSS property belongs to which version of CSS (CSS1, CSS2 or CSS3) and whether a particular property is compatible with particular browser or not.

Visit http://www.w3schools.com/cssref/default.asp to check all CSS properties and their compatibility with browsers.

Let me know if you need more help :)


Cheers :)

skywalker89
07-09-2011, 11:58 AM
Hi vikram...

again: Thank you :thumbsup:

I think I begin to understand...I can myself choose whatever CSS code I use and I can use them all (1-3), as long as I know that for some code (esp. 3) there is no browser support or at least I have to use extra code (ie. -moz-) to have my coding supported on specific browsers...

so I will validate against 2.1, because I want best readability...

But here is my next question ;)


URI : http://www.homeofsolarenergy.com
507 Parse Error Bold

where can I see what this code looks like...if I watch source code in my browser, I don't get line numbers...

and since I have includes, I cannot use the line numbers my editor uses...

is there a way to make W3 show me what code they meant?

AND: Major suggested not to bother with radius and text shadow stuff, though W3V complains...why is that??

Thank again... ;)

Daniel

vikram1vicky
07-09-2011, 01:07 PM
Hi vikram...

again: Thank you :thumbsup:

I think I begin to understand...I can myself choose whatever CSS code I use and I can use them all (1-3), as long as I know that for some code (esp. 3) there is no browser support or at least I have to use extra code (ie. -moz-) to have my coding supported on specific browsers...

so I will validate against 2.1, because I want best readability...

But here is my next question ;)



where can I see what this code looks like...if I watch source code in my browser, I don't get line numbers...

and since I have includes, I cannot use the line numbers my editor uses...

is there a way to make W3 show me what code they meant?

AND: Major suggested not to bother with radius and text shadow stuff, though W3V complains...why is that??

Thank again... ;)

Daniel


Instead of stuck with line numbers, my suggestion is , you can simply do following... that ll make thing easier for you:

1. copy code (with error) from W3 validator site.
2. and search it in your source code...

Isn't simpler than searching/scrolling with line number????? :)

skywalker89
07-09-2011, 01:11 PM
Hi vikram,

yes, it is !!

But
URI : http://www.homeofsolarenergy.com
507 Parse Error Bold

has no code to search for...??? :confused:

Thank you
Daniel

vikram1vicky
07-09-2011, 04:41 PM
Where you tested your site.

test on http://validator.w3.org/

Also follow :

1. Use lower letter elements... means.... use <p> instead of <P>
2. dont give same in element tag... means use <div> instead of <div >
n so... on....

errors listed in above metioned validator are easy to understand...

I am here to help again :)

Major Payne
07-09-2011, 07:57 PM
I said not to bother with text shadow and radius stuff (CSS 3 stuff) as far as correcting the "errors" the CSS validator flagged. The CSS validator is CSS 2.01 and it flags anything that is not CSS 2.01. Although CSS 3 is being implemented in many browsers, Opera and Safari are the best in support of CSS 3.

You are coding to an HTML 4.01 Strict Document Type which is good. Withe this doctype you do not need the space and "/" for those tags which do not have normal closing tags of their own. That's some of the 78 errors being report at http://www.findmebyip.com/litmus . As stated, it is best to use lowercase for tags and attributes. Should you code to an XHYML 1 doctype, then even some JavaScript will have to be lowercase as well.

Make sure you use the same meta character set. "UTF-8" is preferred in the majority of cases.

There will be some errors which are not under your controlled. Specialty codes like Facebook and APIs from other sites will use attributes that can not be identified. These will be flagged, but just ignore them. 100% validation is not a cure-all, but it does help if you understand the errors you have caused by mis-coding.



The Cross-Browser CSS3 Rule Generator (http://css3please.com/)
HTML5 & CSS3 Support (http://www.findmebyip.com/litmus)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum