删除或覆盖TD标签中的垂直对齐?

时间:2015-10-13 01:49:00

标签: jquery html css

我遇到的问题是我的表中的<td>标记导致我使用的JQuery时间选择器垂直显示HH:MM而不是水平显示<td>。在<td>标记之外,时间选择器显示正常,但在其中显示垂直。我相信浏览器会使用vertical-align属性呈现<td>标记,我想知道是否有覆盖它的方法,因此 .time_pick { position: relative; display: inline-block; margin: auto; width: 60%; } .timepicker_wrap { padding: 10px; border-radius: 5px; z-index: 998; display: none; box-shadow: 2px 2px 5px 0 rgba(50,50,50,0.35); background: #f6f6f6; border: 1px solid #ccc; float: left; position: absolute; top: 27px; left: 0; } .time, .mins, .meridian { width: 60px; float: left; margin: 0 10px; font-size: 20px; color: #2d2e2e; font-family: arial; font-weight: 700; } .ti_tx, .mi_tx, .mer_tx { width: 100%; text-align: center; margin: 10px 0; } .prev, .next { cursor: pointer; padding: 18px; width: 28%; border: 1px solid #ccc; margin: auto; background: url(../images/arrow.png) no-repeat; border-radius: 5px; } .next { background-position: 50% 150%; } .prev { background-position: 50% -50%; } 标记不使用vertical-align属性?

我提前为非嵌入图片(帐户限制)道歉。

以下是时间选择器在表格中的显示方式:

[JQuery Time Picker Vertical 1

编辑:

这是我用于Time Picker外观的一些CSS:

[Combined display of each class 2

    <style>
    table, th, td {
        border: 1px solid black;
        border-collapse: collapse;
    }
    th, td {
        padding: 5px;
    }
    </style>

    <input type="text" name="timepicker1" size="70%" id="timepicker1" />

编辑:

表格,TH,TD标签的内联样式表:

{{1}}

1 个答案:

答案 0 :(得分:0)

您需要为<div class="timepicker_wrap"></div>添加宽度 如果你添加它,它应该工作:

.timepicker_wrap{
    width: 240px;
}

我认为只是timepicker_wrap容器中的空间不足以放置在彼此旁边。

相关问题