显示标签和布局的Bootstrap问题

问题描述

我使用了bootstrap 3水平格式。我也一直使用jquery验证插件来验证我的表单。当我尝试在我的输入字段旁边显示一个勾号图像。它不断地在它下面。我已经应用了.valid类包括tick图像显示：inline-block，虽然我仍然没有得到任何结果。这是我有效的类，如果一个输入字段有效的话。这是我的表单组类

I have utilised bootstrap 3 horizontal forms. I also have been using the jquery validator plugin to validate my forms. When I try display a tick image next to my input field. it continually goes underneath it. I have applied the .valid class which consists of the tick image to display: inline-block, although I am still not getting any results. This is my valid class which appends if a input field is valid. This is my form-group class

<div class="form-group">
 <label class="control-label col-lg-3" for="email">Email:</label>
    <div class="col-lg-9">
        <sf:input type="text" name="email" class="form-control" path="email" /><br/><sf:errors path="email" cssClass="error"></sf:errors>
    </div>
</div>

这是我的css'.valid'字段，在输入字段有效后显示。 >

This is my css '.valid' field which displays after a input field is valid.

label.valid{
      width: 30px;
      height: 30px;
      background: url(../img/Done.png) center center no-repeat;
      display: inline-block;
      text-indent: -9999px;
}

这是我得到的图片：

如您所见，标签显示在输入字段下。我想把它直接显示在它旁边。请帮助

This is an image of what I am getting:As you can see the label is displayed under the input field. I would like to display it directly next to it. Please help

推荐答案

您可以应用此CSS和检查

Can you please apply this CSS and Check

.addthiscSS{
    display:inline-block;
    width: auto;
    vertical-align: text-top;
   }

这篇关于显示标签和布局的Bootstrap问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！