OS specific css in firefox add-on

0
votes

Firefox add-on. Facing some padding problems for some XUL elements in mac os (windows, linux are okay). I wish to know if there are any css tricks to identify the OS platform and apply a style to an element only for that OS ? From a search, some of the possible options I found are :

  • Create a separate stylesheet file for the OS and modify chrome.manifest to point to that.
  • Use some external js library and use css selectors.
  • Identify platform from the add-on code, and load and register a second style sheet using the style sheet service

First option requires me to duplicate everything in stylesheets. Second one brings in dependency on other libraries. Third option might work, but I want to know if there are any simpler, elegant solutions ?

Thank you!

1
javascriptcssfirefox-addonxulfirefox-addon-restartless
With first option, you can avoid duplication by putting all common css in one file and then use @import() in platform specific css files. – Kashif
Thanks! I wanted to avoid an @import() and have lots of stylesheets lying around. But yes, this is one proper way of doing things. – user3337744

1 Answers

1
votes

Those three options are pretty much it. For the first option you should put all of the common css in to one css file, and load that on all platforms.