我正在使用 Twitter Bootstrap 制作一个表单,但在对齐“help-inline”元素时遇到了一个小问题。
代码如下:
<form class="form-horizontal" action="purchase.php" method="post" >
<fieldset>
<div class="control-group">
<label class="control-label" for="date">Details</label>
<div class="controls controls-row">
<input class="span2" type="text" id="date" data-date-format="dd/mm/yyyy" title="Enter Date in DD/MM/YYYY Format Only" placeholder="DD/MM/YYYY" value="<?php echo $dateToday;?>" required>
<input class="span2" type="text" name="resin" id="resin" title="Resin Name" placeholder="Resin Name" required/>
<input class="span2" type="text" name="kg" id="kg" title="Enter Quantity in 00.0 format only" placeholder="Enter Quantity" pattern="\d+(\.\d{1})?" required/>
<!-- Below is the problem in question-->
<span class="help-inline">Error Text Here.</span>
</div>
</div>
</fieldset>
</form>
显示未对齐的“此处错误文本”的屏幕截图:https://dl.dropbox.com/u/128104/Random/mia.png
有什么办法解决这个问题吗?
最佳答案
我认为最快的解决方法是在相关跨度上设置 line-height
CSS 属性。如果增加它,它应该向下移动一点并更好地对齐到文本框的中心。
如果您将所有这些放在 fiddle 中,StackOverflow 的用户可以更轻松地为您提供更好的解决方案,因为他们能够更改代码并查看行为。
附言日期 input
字段缺少结束符 /
。
关于html - Twitter Bootstrap 水平形式内联帮助文本问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12470715/