html - 将 div/span 对齐到表格单元格的左上角

Question

我有一个表示日历月的表格。也就是说，每一行是一周，每个单元格是一天。我想在每个单元格的左上角显示日期数字，就像在大多数日历上一样(例如 here )，同时仍然允许任意数量的单词/行的其他内容位于细胞，但我无法让它对齐。关于某些 CSS 的任何想法(或更改 HTML 结构，如果需要)可以使这项工作？这是 some example code .

谢谢!

Answer 1

您可以通过将父元素(td)设置为 position:relative 来轻松做到这一点这导致子元素绝对定位 relative to the element in question , 因为任何绝对定位的元素都是 positioned according to it's closest positioned - absolute, relative, or fixed - parent .正如 Gaby aka G. Petrioli 所正确指出的那样我链接到的规范没有定义 table-cells 的行为设置为 position:relative 时应该起作用然而，所有浏览器实现都始终如一地实现了这一点，在这种情况下，我认为使用这个属性是合适的。

所以你最终需要的是 .day是position:relative和 .date_num_container设置为 position:absolute; top:0px; left:0px;它开始工作，你可以在这里看到: http://cssdesk.com/ERpLC