我想知道为什么网格柱的自动高度在TailWindcss中不起作用:
<script src="https://cdn.tailwindcss.com"></script>
<div class="grid grid-cols-3 gap-4">
<div class="bg-blue-100" style="height: auto!important">test</div>
<div class="bg-blue-100 h-auto">test</div>
<div class="bg-blue-100">test<br />test</div>
</div>如果我设置为h-xxx，但我想要自动高度，它会起作用的.所有的COL都应该有一个基于其内容的高度，而不是基于最高的COL.
Align-Items的缺省值为normal，其作用类似于栅格容器中的stretch.您需要改为设置为align-items:base-line.(tailwind 向为items-baseline，或其他对齐值，如center，具体取决于您的需要.)
<script src="https://cdn.tailwindcss.com"></script>
<div class="grid grid-cols-3 gap-4 items-baseline">
<div class="bg-blue-100">test</div>
<div class="bg-blue-100">test</div>
<div class="bg-blue-100">test<br />test</div>
</div>至于为什么height:auto不工作，当align-items:stretch被设置时，每一项动作as defined for justify-self:stretch.因此，根据spec，将高度设置为AUTO不会使其适合内容的高度.
当框的计算宽度/高度(适合于轴)为is auto时，并且框的两个边距(在适当的轴上)都不是自动的，则将框的使用大小设置为使其外部大小尽可能接近填充对齐容器所需的长度，同时仍然遵守最小高度/最小宽度/最大高度/最大宽度施加的约束.
正因为如此，在每一项上设置h-fit也是可行的.