MSO Stylis Plugin
A Stylis plugin that adds support for the mso-
CSS vendor prefix. It
automatically adds the mso-
prefix and -alt
postfix for all Microsoft Office
alternative CSS properties (see msotype). It also prevents a leading
-
from being added. So you'll get mso-
instead of -mso-
.
Install with yarn
yarn add stylis-plugin-mso
Or install with npm:
npm install stylis-plugin-mso
Using with Stylis
;; stylis.useplugin; stylis'.foobar', `{ color: tomato; }`;// => .foobar { mso-color-alt:tomato; color:tomato; }
Using with EmotionJs
To use with EmotionJs, you'll need to add a <CacheProvider />
. Note
that when multiple <CacheProvider />
are used, all of your styles will be
parsed twice. So make sure to add this at the top of your app. See more at
@emotion/cache.
;; ; ;
Automatic Vendor Prefix
By default, the mso-
prefix and -alt
postfix are automatically applied to
all Microsoft Office alternative CSS properties. You can disable this by
creating an instance of the plugin and setting the prefix
option to false
.
;; ; stylis.set;stylis.useplugin; stylis'.foobar', `{ color: tomato; }`;// => .foobar { color:tomato; }
API
createPlugin
createPluginoptions?: object: StylisPlugin
options
prefix?: boolean
: Toggles automaticmso
vendor prefixing. Default:true
.