Is it possible to detect Firefox Browser only with CSS like IE?
for example, IE browser can be detected like:
<!--[if IE 7]>
/* IMPORTING CSS FOR IE */
<![endif]-->
Can be Firefox browser detected like this code?
Asked
Active
Viewed 2.4k times
25
Aron Rotteveel
- 81,193
- 17
- 104
- 128
zur4ik
- 6,072
- 9
- 52
- 78
-
1Basically, no. So far as conditional comments go it's either IE or not-IE, unfortunately. – David Thomas May 03 '11 at 18:44
-
Please use a descriptive title when posting a question instead of just a seperated set of keywords. – Aron Rotteveel May 03 '11 at 18:46
-
The question is why you would want to detect Firefox? Do you have any certain reason to do so? Firefox CSS support isn't broken, unlike IE. – Konrad Borowski May 03 '11 at 18:47
-
I want to change some element position only for Firefox. in other browsers it works correctly. – zur4ik May 03 '11 at 18:51
-
1@GlitchMr Are you serious? You think Firefox doesn't display things differently (like all individual browsers)? What do you mean why would he want to do this? I just got through making a complex form for a database-driven web-interface site, and Firefox is the only browser that for some reason likes to scrunch all the texareas too close to the other fields. If I spread them out then they are too far apart for IE and Chrome. I know that detecting a browser and styling differently based on this detection shouldn't be the first answer, but to wonder why he would want this is just, well, weird... – VoidKing Oct 26 '12 at 14:11
2 Answers
61
Not that I know of, but you can try this:
@-moz-document url-prefix() {
#my-id { font-size: 100%; }
}
This website has more options as well
You can place this in your CSS file or between your <style type='text/css'> tags in your HTML. Works Fine!
Donald Duck
- 8,409
- 22
- 75
- 99
Soatl
- 10,224
- 28
- 95
- 153
-
@Peppered Lemons Do you mind clarifying where that goes? CSS file, js file, or cshtml file? – VoidKing Oct 26 '12 at 14:14
-
2awesome! Does anyone know whey the url-prefix() needs to be included? – hallodom Sep 26 '13 at 14:30
32
Nowadays you can use the @supports CSS rule:
@supports not( -moz-appearance:none ){
/* Add non-firefox CSS code here */
}
-
3Really helpful. But to get it to work in Chrome, I had to add a space between 'not' and '(' – cmgharris Jan 25 '19 at 10:07
-