Ruby On Rails : Get auto-added browser prefixes for css, sass styles where required

Autoprefixer is a tool to parse CSS and add vendor prefixes to CSS rules using values from the Can I Use. This gem provides Ruby and Ruby on Rails integration with this JavaScript tool.

Add the autoprefixer-rails gem to your Gemfile:

# In Gemfile
gem "autoprefixer-rails"


# Install the gem
$ bundle install

Clear your cache:

rake tmp:clear

Add your css styles without browser prefixes in .css, .scss, or .sass file. Then you find that your style have prefix added. If you have

.fullscreen a {
    display: flex;
}

you will get

.fullscreen a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

Also see

https://github.com/postcss/autoprefixer

2 thoughts on “Ruby On Rails : Get auto-added browser prefixes for css, sass styles where required

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s