Question

我有一个表格，其中有一些我希望在线显示的输入，但是在宽度太小之前它会断行。这是代码：

<div data-role='fieldcontain' id='TempLimits'>
<label for='Tmin' style='display-inline;width:50px'> Min.:</label>
<input type='text' name='Tmin' id='Tmin' value='0' style='display:inline;width:50px' />
<label for='Tmin' style='display-inline;width:50px'> ºC</label>
<br>
<label for='Tmax' style='display-inline;width:50px'>Max.:</label>
<input type='text' name='Tmax' id='Tmax' value='60' style='display:inline;width:50px' />
<label for='Tmax' style='display-inline;width:50px'> ºC</label>

这是显示我想要保留什么以及问题是什么的图像（我不能直接通过声誉发布）：

In line labels Not in line labels

此外，有没有办法让标签与输入的中心/底部对齐而不是输入的顶部？

非常感谢

Answer 1

将css样式float: left附加到元素，这些元素会自动转到下一行。

我认为这应该适用于第一行：

<label for='Tmin' style='width:50px'> Min.:</label> <input type='text' name='Tmin' id='Tmin' value='0' style='float: left; width:50px' /> <label for='Tmin' style='float: left; width:50px'> ºC</label>

jquery-mobile：某些行中的标签+输入+标签

1 个答案: