jquery - 多个定位对齐的类被拉到一个 div 而不是它们各自的 div

Question

http://jsfiddle.net/58arV/

我得到了 4 个答案，其中一个答案是在“提问”组件中选择用户是正确的。

所以，我想用 4 种输入样式和所有 4 种右侧的 DIV 冒充一个复选标记“收音机”......所以如果用户点击框..该框得到一个“复选标记”，而其余的得到红色的“x”...

<div class="answer">
<input type="text" autocomplete="off" name="answer" id="answer-1" placeholder="Answer 1" class="form-control input" value="" />
<button type="radio" class="btn btn-success answer-type" style="" value="1">
<i class="glyphicon glyphicon-ok"></i>
<div class="left-check"></div>
</button>
</div>

问题是所有框都被拉到第一个输入的右上角。

帮助？

Answer 1

您只需要以下附加 CSS：

.answer { position:relative; }

更新示例：http: //jsfiddle.net/58arV/1/

根据经验（可能根据 CSS 规范）：绝对元素的定位是相对于它最近的父元素（相对或绝对元素）。