我正在尝试弄清楚如何将表格单元格的数据与表格行的顶部对齐。
<tr className="flex-1 items-center align-top">
<td className=" py-1 pl-1 pr-1 text-sm sm:pl-6">
<div className="flex-1 items-center align-top">
<div className="flex-1 items-center align-top">
<p className="flex-1 items-center align-top">
title
</p>
<p className="flex-1 align-top">
short multi line sentence about one third the length of the sentence in the next column, I want both cells to align to the top.
</p>
</div>
</div>
</td>
我看过这个article,它说如果我想垂直对齐数据,我必须在flex类中使用items-center
。我试过这个,但是内容仍然呈现在垂直中心。
下一列大约有两倍的数据,因此此列中的单元格数据显示在垂直中心。我希望它与行的顶部对齐。
我该怎么做呢?
1条答案
按热度按时间iyr7buue1#
正如John Li所指出的,您可能希望使用
flex
,因为如果flex-1
不在包含flex
的 Package 器中,它就没有用。实际上并不需要所有的 Package 器div,单元格内容应该与顶部对齐,而不使用
items-
或align-
。此处为沙箱:https://play.tailwindcss.com/QPUuacC4Rj