😎
tailwindcssでhoverをPCのみにする
はじめに
スマホだとボタンをタップするとホバーのスタイルが反映されて困っていましたが、tailwind.config.jsに1行追記するだけで対応できたのでまとめます。
問題
- スマホだとボタンをタップするとホバーのスタイルが反映されてしまう
-
tailwindのバージョンが3.1以降から使える設定方法
解決方法
tailwind.config.js
/** @type {import('tailwindcss').Config} */
module.exports = {
// ... other options
future: {
hoverOnlyWhenSupported: true,
},
};
おわりに
設定一つ追加するだけで対応できるのは楽ちん！
Discussion