Question

这些是我的div的css代码，我首先制作一个slothead类div，然后是水平的几个插槽。

div.slotshead{
    z-index:3;
    position:relative;
    border: 1px solid #5f92d2;
    width: 130px;
    height: 50px;
    color: #003366;
    font-size:15px;
    text-align:center;
    font-family:'arial';
}

div.slots{
    z-index:3;
    position:relative;
    border: 1px solid #d0d0fe;
    width: 45px;
    height: 50px;
    color: #003366;
    font-size:10px;
    text-align:center;
    font-family:'arial';
}

这是其中的代码

echo '<h3>';
for ($i = 0; $i < 31; $i++) {
    echo "<div class=slotshead id=$i>";
    If($i==0){
        echo 'TIME';
    }
    echo "</div>";

    for ($j=0;$j < 23;$j++) {
        echo " <div class=slots>";
        If(($i==0)){
            $start = strtotime('8am');
            $k++;
            $tod = $start + ($k * 15 * 60);
            echo date('H:i A', $tod);
        }
        echo "</div>";
    }

    echo '<br>';

}
echo '</h3>';

这是示例jsfiddle

在这里，插槽工作正常，但 slothead（带有'TIME'的div）向下移动，为什么会这样？仅供参考，我试过vertical-align=top;但没有用......

Answer 1

好的，我觉得这就是你的要求

在css add

中

h3{margin:0;padding:0;}

例如

DEMO

仍然想要降低平均值，请参阅以下内容

html,body,h3{margin:0;padding:0}

DEMO

放入文本时，CSS div框会向下移动一点

1 个答案: