search

tailwindlabs / discuss

A place to ask questions, get help, or share what you've built with Tailwind CSS.
MIT License
171 stars 9 forks source link

Select Box ignoring padding and other styles "tailwindcss": "^0.4.0" #110

Open roarkmccolgan opened 6 years ago

roarkmccolgan commented 6 years ago

Hi All,

Hoping someone could assist with this problem, I have a straightforward TW config with only one or 2 custom colors but when trying to style a select element it's ignoring padding and some other declarations.

Using my compiled css and the demo from tailwindcomponents.com I've created a fiddle https://jsfiddle.net/roark/ukheej5q/

You are able to see the select box is out of wack.

Thanks

adamwathan commented 6 years ago

Hey! In this case the issue is that appearance-none isn't being properly applied because your CSS is missing vendor prefixes. You'll want to add autoprefixer to your build process 👍 Happy to help with specifics if needed if you want to share more details about how your project is set up?

roarkmccolgan commented 6 years ago

Thanks Adam!

I'm using webpack so followed instructions on postcss/autoprefixer GitHub page and added the following to my postcss.config.js

module.exports = {
    plugins: [
        require('tailwindcss')('./tailwind.js'),
        require('autoprefixer')
    ]
}

And it works, thanks for the heads up!