0

I know stylesheets are the best place for CSS, but I was wondering if there was any way to add CSS specific to Firefox using jQuery.

The typical way to add CSS using jQuery uses this syntax:

$('select').css('margin', '1em');

The CSS query specific to Firefox is something like this:

@-moz-document url-prefix() {
  select {
    padding: 0.25em;
    margin-top: -0.2em;
  }
}

Is there a way to adapt the jQuery CSS command to use the Firefox media query?

I suppose if there was a way then it can be made to work for Chrome, Safari and IE as well.

pmagunia
  • 1,718
  • 1
  • 22
  • 33
  • `Is there a way to adapt the jQuery CSS command to use the Firefox media query` No. They rely on the selectors only available in a stylesheet, not on inline styling. You shouldn't really be doing this anyway. This may be caused by the slight differences in the browsers default styles, in which case I'd suggest you include a reset stylesheet *before* adding your own styles. – Rory McCrossan Nov 27 '17 at 16:43
  • You may have your reasons for targeting Firefox specifically, but in general I would recommend _feature detection_ over _browser sniffing_. Some good points are made [in the answers to this question](https://stackoverflow.com/questions/1294586/browser-detection-versus-feature-detection) – agrm Nov 27 '17 at 17:01
  • @agrm, Rory: Thanks, these are good recommendations. I will look for an alternative. – pmagunia Nov 27 '17 at 17:19

1 Answers1

0

As of jQuery 1.9, $.browser, which detects browser type is deprecated.

Check this SO question for more information and possible solution.

LordAlpaca
  • 166
  • 5