if (Chrome) condition fix

[Manganix]

I'd like to know about if you see any shocking differences between FireFox & Chrome??

there are some minor differences between firefox (my favorite + default) and chrome (outline navigation menubar goes a bit wrong / not centered).

To fix this, I'd like to set up a specific stylesheet.css for Chrome (stylechr.css):

In the header:

<link href="CSS/myCSS_style.css" rel="stylesheet" type="text/css" />

= default stylesheet

AND

<script type="text/javascript">
    if (navigator.userAgent.toLowerCase().indexOf('chrome')!=-1)
    document.write('<link rel="stylesheet" type="text/css" href="CSS/stylechr.css"/>')
    
    </script>

stylesheet to be applied only when browsing in Chrome.

when I do this, the browsers recognize this new stylesheet; no problem with that. But the issue is that the Chrome-specific stylesheet is applied to all browsers.

Wish someone could help, THX!
Website = http://gamanga.com/

 

[Phreaddee]

I'd like to set up a specific stylesheet.css for Chrome

and while your at it you may as well make specific stylesheets for safari, opera and internet explorer 9, 8, 7, 6 (if your brave!) because they are all going to look slightly different...

Whenever things go awry for me in different browsers 99% of the time it is dodgy css; missing css3 prefixes, unusual positioning, etc... or sloppy html; unclosed tags...

the only time really i'd target a specific browser would be for older versions of internet explorer, but to me that sounds like a design issue and I think you could fix it in your css before resorting to this.

 

[Manganix]

no one to help me out here with this?

Perhaps its true that the coding isn't 100%; I've started learning HTML etc. not even a month ago. The next project will be better I hope (coding-wise).

But in the mean time, if anyone could help me out with this "If (Chrome)" possibility to set a stylesheet specific for chrome.

Thank again ;-)

@Phreaddee
because of my newly acquired HTML knowledge, I'm not seeing what the issue could be.
You're free to have a quick look into the source code, and tell me if you see shocking/dummy things I've done.
Thank anyway.

 

[chrishirst]

Man, browser "sniffing" went out of use when Netscape killed off version 4.5 their browser (late 1990's) and browser developers realised their applications HAD to conform to a true standard instead of them having so many proprietary methods and properties that had to be worked around.
There are still a few niggles but "browser sniffing" and "CSS hacks" is NOT the way to solve them anymore.

 

[Manganix]

@chrishirst

Man, you're still posting messages containing facts everyone knows or could find on wiki!
But, once again, no suggestions or no answers to the questions posted by the owner.

As I mentioned before, I'm new to this HTML/CSS/Webdesign stuff. There certainly best-practices I don't know of at this time. IF CSS-tricks isn't the way anymore, maybe you could be a bit more clear about alternatives, or just find a knew way to kill your time, instead of polluting my threads!

Netscape killed off version 4.5 their browser (late 1990's)

Seriously; copy-pasting these kind of 'facts' from the internet, isn't helping anyone at this point.

 

[ronaldroe]

css-tricks is a good resource if you already know what you're doing. Sure, he has a few beginner tutorials on there, but for the most part, it's intermediate to advanced type stuff. Give this a look: http://www.cssbasics.com/

Regarding your problem: I can't think of any time I've ever had something work in most browsers but be broken in Chrome, or any Webkit browser for that matter. I think that may be the problem you're running into. No one really knows how to help you. What people are trying to tell you is instead of creating a CSS file only for Chrome, just fix what you have. Start by running it through a CSS validator.

 

[ronaldroe]

css-tricks is a good resource if you already know what you're doing. Sure, he has a few beginner tutorials on there, but for the most part, it's intermediate to advanced type stuff. Give this a look: http://www.cssbasics.com/

Regarding your problem: I can't think of any time I've ever had something work in most browsers but be broken in Chrome, or any Webkit browser for that matter. I think that may be the problem you're running into. No one really knows how to help you. What people are trying to tell you is instead of creating a CSS file only for Chrome, just fix what you have. Start by running it through a CSS validator.

 

[Phreaddee]

your question was answered in post #2.

what you are suggesting I liken to standing on a train track. instead of walking across the tracks to the otherside you decide the best way to avoid the train is to rip up the line. the problem is we are all telling you to get off the tracks and you are ignoring that, because you've already started ripping up the track.

so you've been coding for just over a month?...please listen and fix the css before doing browser sniffing. The point is if you "know" already that that is bad, why are you heading down that path.

you might think mr chris is a bit gruff. you may be right. but he does know what he is referring to, and I would always value his opinion over a "wiki" any day of the year, plus he is copy 'n pasting from his brain and experience...(just worth noting that)...

and besides chrome is the most popular browser worldwide, so it might be best to build for chrome, then tackle odd issues in the other browsers.

save the seperate css for ie.

 

[Manganix]

chrome fix

please listen and fix the css before doing browser sniffing

OK got it. I played with the padding for a while, and finally now its same in both firefox and chrome.

As you mentioned, chrome is THE most popular and followed by firefox. IE is loosing terrain every day. At this point I'm getting into fixing it for IE too.

I think, I hope when I get more confortable in HTML/CSS coding, I'll look into fixing IE as well.

Thanks to all for the tips!

Grz,