如何在Tailwind类名中转换以下css行?

xqkwcwgp  于 2023-05-08  发布在  其他
关注(0)|答案(3)|浏览(174)

这一行看起来像这样:grid-template-rows: auto 1fr;
当搜索所有的文档时,也当使用css to tailwind converted时,我找不到解决方案。

gojuced7

gojuced71#

你能试试grid grid-flow-row auto-rows-[1fr]
文档给出了一个任意值grid grid-flow-row auto-rows-[minmax(0,_2fr)]的代码示例
您也可以尝试在tailwind.config.js中自定义主题。下面是一个关于如何完成的例子:

module.exports = {
  theme: {
    extend: {
      gridAutoRows: {
        '2fr': 'minmax(0, 2fr)',
      }
    }
  }
}

您也可以尝试:auto-rows-max-[1fr]

1dkrff03

1dkrff032#

可以试试grid grid-rows-auto-1fr吗?

m2xkgtsf

m2xkgtsf3#

要达到相同的结果,而不像提到的here扩展Tailwind CSS
我们必须从像grid grid-template-rows: auto 1fr;这样显式定义网格大小,改为像这样定义grid-auto-rows: auto 1fr;
为了使用Tailwind实现这一点,您必须在父类上使用以下类名:

auto-rows-[auto_1fr]

相关问题