Css problems in chrome

How To Fix Google Chrome CSS??

Hi all.. I just done a website using HTML,CSS and PHP. For now,my website is only fine to be displayed in Mozilla and IE.. For IE(Internet Explorer), I just fix the css by doing another CSS layout for that.
like this one :

But I dont know how do i do that for Google chrome?
and i until now,i still have no idea to fix the css for IE by not doing the
statement..Could you guys tell me how to really code the css to fixing the cross browser platform problem?? or any sources of reference perhaps? Thank You 🙂

• 6 Contributors
• 13 Replies
• 1K Views
• 3 Years Discussion Span
• Latest Post 9 Years Ago Latest Post by shaddam

Recommended Answers Collapse Answers

The golden rule of HTML/CSS coding — your code must be valid. If it already is then there should be no (or very minor) differences between what your site looks at most recent versions of Firefox/Chrome/Safari/Opera/IE9.

If you are sure that you have done everything correctly but still have …

This code detects if the browser is Chrome and when it is it loads diffferent style sheet. If you test your pages on Mozilla you could have very minor differences in Chrome so you’ll probably have to replace just few lines of code in the stylesheet:

All 13 Replies

The golden rule of HTML/CSS coding — your code must be valid. If it already is then there should be no (or very minor) differences between what your site looks at most recent versions of Firefox/Chrome/Safari/Opera/IE9. If you are sure that you have done everything correctly but still have any problems in other browsers other than IE then you can use Javascript Navigator object or some functionality of Javascript jQuery lib to detect specific browsers. Note that for this to work Javascript must be enabled in client`s browser (imho not a problem since 9x % of users have it enabled). On the other hand, the best way to solve IE6/7/8 problems is to use conditional tags as you have already done.

This code detects if the browser is Chrome and when it is it loads diffferent style sheet. If you test your pages on Mozilla you could have very minor differences in Chrome so you’ll probably have to replace just few lines of code in the stylesheet:

Old thread, but the solution provided doesn’t and didn’t work for me. I am using Chrome 16.
The old solution was

Old thread, but the solution provided doesn’t and didn’t work for me. I am using Chrome 16.
The old solution was

The code you’ve provided doesn’t work. The if is completely ignored with that «;» at the end of the line. This works fine:

@t30
Thanks for your reply and your own solution. I prefer using semicolons at the end, old programming habit. JS does not require you to end with a semicolon, but the code still works if you include them. JS does not malfunction due to that. Re your solution, it works for me too. My solution also works, seems there is more than one way to skin the proverbial cat.

@t30
Thanks for your reply and your own solution. I prefer using semicolons at the end, old programming habit. JS does not require you to end with a semicolon, but the code still works if you include them. JS does not malfunction due to that. Re your solution, it works for me too. My solution also works, seems there is more than one way to skin the proverbial cat.

mmmmmmhhh. I think you might be making a mistake, with the semicolumn at the end of the «if» line, the script works but not with the behaviour you’re expecting. Usually an if condition has this structure:

if(some condition will be satisfied)

if(some condition will be satisfied) single line statement

if(some condition will be satisfied)<>

So, the if condition is checked but completely ignored. The lines that follows the if will be executed regardless. So, in your case, if you check only the behaviour in chrome, everything seems ok. But the same css will be added also in other browsers. If you want you can verify what I’m saying by adding an alert message after the semicolumn.

if(some condition will be satisfied); alert('oh my god. ');

or you can simply verify that the css will be added also in firefox e.g. Hope this helps! Regards,
Matteo.

Matteo, Thanks again and sorry for only replying now. Again, I created my solution to work for Chrome and the IE9. It works perfectly on both. I use Arachnophilia as a web editor. What I did in the meantime was to give you the benefit of the doubt, omit my solution, take your solution and try it out. Following has happened: The first time I tried it, it worked. This was the day you posted your solution. I have not had time to look at it since. Today I again opened my modified file, loaded it directly from Arachnophilia and it didn’t work. I am talking about launching the IE directly from Arachnophilia. However, when I go into the windows file explorer and open the file directly from there (right click), it works perfectly on both browsers just like my old version did. To be honest, I am a little confused now. Perhaps it’s got something to do with parameters passed by Arachnophilia and has nothing to do with your solution, I simply don’t know.
Regards,
Confused C

Matteo, Thanks again and sorry for only replying now. Again, I created my solution to work for Chrome and the IE9. It works perfectly on both. I use Arachnophilia as a web editor. What I did in the meantime was to give you the benefit of the doubt, omit my solution, take your solution and try it out. Following has happened: The first time I tried it, it worked. This was the day you posted your solution. I have not had time to look at it since. Today I again opened my modified file, loaded it directly from Arachnophilia and it didn’t work. I am talking about launching the IE directly from Arachnophilia. However, when I go into the windows file explorer and open the file directly from there (right click), it works perfectly on both browsers just like my old version did. To be honest, I am a little confused now. Perhaps it’s got something to do with parameters passed by Arachnophilia and has nothing to do with your solution, I simply don’t know.
Regards,
Confused C

Hi Charlynne, except of your enviroment, Arachnophilla or whatever you’d like to use, I’m talking about a general programming rule. Try this simple code: http://jsfiddle.net/E5Jpp/1/
You can try it in every browser. simply open the page and check the result in the bottom right box. The first piece of code:

if (navigator.userAgent.toLowerCase().indexOf('you can write everything yo. ') > -1); document.write('rendered in every browser. ');

is like your code: you can see the semicolon at the end of the if line. The document.write line will be executed in every browser. The second piece will be executed only in chrome instead:

if (navigator.userAgent.toLowerCase().indexOf('chrome') != -1)< document.write('

rendered only in google chrome. '); >

if (navigator.userAgent.toLowerCase().indexOf('chrome') != -1) document.write('

rendered only in google chrome. ');

without brackets. Definetely, I don’t know why your code could works.
If you want you can write your own Fiddle and let me try your code. Regards,
Matteo

Источник