Targeting only Firefox with CSS

by

OK, I’ve found it. This is probably the cleanest and easiest solution out there and does not rely on JavaScript being turned on.

@-moz-document url-prefix() {
  h1 {
    color: red;
  }
}
<h1>This should be red in FF</h1>

It’s based on yet another Mozilla specific CSS extension. There’s a whole list for these CSS extensions right here: Mozilla CSS Extensions.

More Related Contents:

  1. Does Firefox support position: relative on table elements?
  2. How can I get FF 33.x Flexbox behavior in FF 34.x? [duplicate]
  3. How to remove Firefox’s dotted outline on BUTTONS as well as links?
  4. CSS \9 in width property
  5. Amazon S3 CORS (Cross-Origin Resource Sharing) and Firefox cross-domain font loading
  6. How to apply specific CSS rules to Chrome only?
  7. Remove extra button spacing/padding in Firefox
  8. Content url does not display image on firefox browser
  9. How to make CSS visible only for Opera
  10. Background-image in keyframe does not display in Firefox or Internet Explorer
  11. Font-size issues comparing chrome and Firefox
  12. Prevent flex item from exceeding parent height and make scroll bar work
  13. Borders not shown in Firefox with border-collapse on table, position: relative on tbody, or background-color on cell
  14. Firefox ignores padding when using overflow:scroll
  15. Fonts looks different in Firefox and Chrome
  16. How do I Make Firefox Print a Background-Color Style?
  17. Faster way to develop and test print stylesheets (avoid print preview every time)?
  18. Scrollbar color change in Firefox
  19. Percentage padding / margin on grid item ignored in Firefox
  20. What does @-moz-document url-prefix() do?
  21. CSS “outline” different behavior behavior on Webkit & Gecko
  22. Hide Up & Down Arrow Buttons (Spinner) in Input Number – Firefox 29
  23. Preventing an image from being draggable or selectable without using JS
  24. background-attachment fixed with transform not working in Firefox
  25. SVG Fill not being applied in FireFox
  26. position relative in firefox [duplicate]
  27. Firefox blurs an image when scaled through external CSS or inline style.
  28. Firefox sets wrong caret position contentEditable with :before
  29. Image scaling by CSS: is there a webkit alternative for -moz-crisp-edges?
  30. :nth-letter pseudo-element is not working [closed]

Leave a Comment