我需要在表格单元格的顶角放置一个元素,并且文本应该堆叠在底部。我使用 vertical-align: bottom 将所有文本向下移动,但现在我遇到了顶部元素的问题,因为 table-cell 不支持相对定位......任何想法如何做到这一点?
<div style = "display: table-cell; vertical-align: bottom">
<div class = "top"> Top corner</div>
<h2> some text in the bottom </h2>
<h3> some more text in the bottom </h3>
</div>
编辑:它应该看起来像这样
+-----------+ +-----------+ +------------+
|top text | |top text | |top text |
| | | | | |
|some long | | | | |
|text | | | | |
|more long | | | | |
|text | | | | |
|end of | | | |some text |
|text | |text | |text |
|<button> | |<button> | |<button> |
+-----------+ +-----------+ +------------+
这一切都包含在一个带有 display:table 的 div 中。我想在这里使用 display:table-cell 的原因是保持这些列的高度相同,并且仍然可以灵活地适应列中不同长度的文本。