垂直CSS时间线稳定标记

Question

说明
有12 hours天的垂直时间轴。
高度为720px 从第一眼开始，标记应如下所示：

<div style="margin-top:0px;">
 9:00
</div>
<div style="margin-top:60px;">
 10:00
</div>
       ...
<div style="margin-top:60px;">
 11:00
</div>

已经发生，我们应该考虑font-size 因为它更多，应该是margin-top属性的值。

演示： see markup
对于margin-top的当前字体大小值为38px
从逻辑上讲，它应始终等于60px。

问题：
对于垂直timilene，CSS解决方案没有JS，这不依赖于font-size吗？

Answer 1

目前还不清楚你想要什么。但我怀疑你想确保时间轴的间隔相等。

您不需要使用margin-top来补偿字体大小。删除那些内联样式，并使用

简单地修复div的高度

.timeline-container > div{
   height:60px;   
}

请参阅：http://jsfiddle.net/fmSfc/4/

Answer 2

使用常量行高 - 您可以在不更改margin-top和整体高度的情况下更改font-size。查看更新：http://jsfiddle.net/fmSfc/6/

此外，最好使用未排序的列表然后使用div，因为您有许多列出的类似元素。