title: Multiple positioned-aligned classes pulled to one div instead of their individual div
body: <p><a href="http://jsfiddle.net/58arV/" rel="nofollow">http://jsfiddle.net/58arV/</a></p>
  
  <p>I got 4 answers where one will be correct by the choosing of user in a "question-making" component.</p>
  
  <p>So, I thought of doing it with 4 input styles and a DIV on the right of all 4 posing as a checkmark "radio"... so if the user clicks on box.. that box gets a "checkmark" while the rest get the red "x"...</p>
  
  <pre><code>&lt;div class="answer"&gt;
  &lt;input type="text" autocomplete="off" name="answer" id="answer-1" placeholder="Answer 1" class="form-control input" value="" /&gt;
  &lt;button type="radio" class="btn btn-success answer-type" style="" value="1"&gt;
  &lt;i class="glyphicon glyphicon-ok"&gt;&lt;/i&gt;
  &lt;div class="left-check"&gt;&lt;/div&gt;
  &lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The problem is that all of the boxes are pulled to the top-right of the first input.</p>
  
  <p>Help?</p>