Tailwind css 负面翻译

Question

以下代码生成翻译但不生成否定代码，因此以下代码不起作用 -translate-x-1/7 但测试 translate-x-1/7 它可以。

我正在使用负翻译将导航栏滑出页面的一侧。

module.exports = {
  purge: ['./src/**/*.{js,jsx,ts,tsx}'],
  darkMode: false, // or 'media' or 'class'
  theme: {
    extend: {
      translate: {
        '1/7': '14.2857143%',
        '2/7': '28.5714286%',
        '3/7': '42.8571429%',
        '4/7': '57.1428571%',
        '5/7': '71.4285714%',
        '6/7': '85.7142857%',
       },
    },
  },
  variants: {
    extend: {
    },
  },
  plugins: [
    require('@tailwindcss/forms'),
  ],
}

Answer 1

我刚刚测试过它并且工作正常：play.tailwindcss.com/Duhp6l1ejl

您使用的是哪个版本的 Tailwind？我看到您仍在使用 purge，所以可能不是最新的。也许这是 Tailwind 中的错误，您只需要更新？

Tailwind css 负面翻译

Tailwind css negative translate

tailwind-css