最小高度在顺风时不能正常工作答案

【问题标题】：Min-height not working properly with tailwind最小高度在顺风时不能正常工作
【发布时间】：2021-10-11 02:19:05
【问题描述】：

我正在使用顺风类min-h-screen，但它不会改变元素的高度。它甚至没有显示在开发工具中。在style="height: 100vh;" 等样式属性中设置高度时，它会更改元素的高度。

<div class="bg-white flex-1 p-6 flex flex-col w-3/4 xl:w-full 
z-10 min-h-screen" style="box-shadow: 4px 0 6px -4px rgba(0, 0, 0, 0.3);">
    content
</div>

高度没有设置在其他任何地方。

我想用minHeight: {'m100v': '100vh'} 编辑配置文件，但我猜标准方式应该可以工作。

【问题讨论】：

您是否在 tailwind.config.js 中声明了一些自定义的 minHeight 值？
@MihaiT 我刚刚编辑了这个问题。我刚刚做了，它可以正常工作。但标准类没有。
不不，我的意思是除了那个。您是否在配置中为 minHeight 设置了一些自定义值？
哦，我明白了！我忘记将自定义设置放入“扩展”块中，因此默认设置被覆盖。

标签： css tailwind-css

【解决方案1】：

我了解到您已将 minHeight 的自定义值放入您的顺风配置中。如果它们与默认值不同，则无关紧要，默认值将被忽略。

所以，如果你想添加自定义值，你需要扩展你的主题对象。见下文

module.exports = {

   theme: {
      extend: {
       minHeight: {
           'custom': '234',
           }
      },
   }
}

然后你保持默认值不变。

【讨论】：