css - 表单输入反馈在 Bootstrap 中有按钮插件时位置错误

Question

我在表单的输入字段中添加了反馈和按钮插件。我的 HTML 如下:

<div class="form-group has-feedback">
    <label class="col-sm-4 control-label" for="authorization_id">AutorisationsID</label>
    <div class="col-sm-4">
        <div class="input-group">
            <input name="authorization_id" class="form-control" type="text">
            <span class="glyphicon form-control-feedback"></span>
            <span class="input-group-btn">
                <a href="#" id="authid-info-btn" tabindex="0" class="btn btn-info" role="button" data-position="auto right" data-container="body" data-toggle="popover" data-trigger="click" data-content="And here's some amazing content. It's very engaging. Right?">
                    <span class="glyphicon glyphicon-question-sign">
                </a>
            </span>
        </div>
    </div>
    <div class="col-sm-4 control-label control-label-left-align"></div>
</div>

这是它的样子:

这是我想要的样子

存在按钮插件时，反馈定位错误。我是否遗漏了什么或者 Bootstrap 不支持这种设计？

Answer 1

我把你的内容塞进了这里:http://jsfiddle.net/DTcHh/2459/

但我不知道如何让 X 出现。有什么办法可以在 fiddle 中效仿吗？

会是这样的

.redX {
position: relative;
left: -10px;
}

或者可能对边距或填充进行小幅调整。它可能有很多东西，但可能是 css 中的简单修复。一个活生生的例子是最好的，真的。