nDmitry / grunt-autoprefixer

Parse CSS and add vendor-prefixed CSS properties using the Can I Use database. Based on Autoprefixer.
MIT License
795 stars 60 forks source link

Autoprefixer Removing Too Much #61

Closed coreymason closed 10 years ago

coreymason commented 10 years ago

It is my understanding that for the android 2.3 browser -webkit-box-sizing is needed (http://caniuse.com/#search=box-sizing) but yet autoprefixer is removing it. Also, is there a way to stop autoprefixer from removing what it thinks is unnecessary so that it only adds to my css?

This is the relevant section of my Gruntfile...

autoprefixer: {
            dev: {
                browsers: ['> 1%', 'Android >= 2.1', 'Chrome >= 21', 'Explorer >= 7', 'Firefox >= 17', 'Opera >= 12.1', 'Safari >= 6.0'],
                src: 'style.css'
            }
        },

Before...

input[type="search"] {
  -webkit-appearance: textfield;
  /* Addresses appearance set to searchfield in S5, Chrome */
  -webkit-box-sizing: content-box;
  /* Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof) */
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

After...

input[type="search"] {
  -webkit-appearance: textfield;
  /* Addresses appearance set to searchfield in S5, Chrome */
  /* Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof) */
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
ai commented 10 years ago

Maybe browsers options do no set? When I try with binary:

echo "input[type="search"] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}" | ./autoprefixer -b 'android >= 2.1'

it returns

input[type=search] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
Rowno commented 10 years ago

You're missing the options key, so the browsers aren't actually being set. Try this:

autoprefixer: {
    dev: {
        options: {
            browsers: ['> 1%', 'Android >= 2.1', 'Chrome >= 21', 'Explorer >= 7', 'Firefox >= 17', 'Opera >= 12.1', 'Safari >= 6.0'],
        }
        src: 'style.css'
    }
},
coreymason commented 10 years ago

That works, thanks.