css - (Rails) 单选按钮不与文本对齐

Question

我希望 ff.label 与 ff.radio_button. 对齐，但现在我的 View 中它们相距甚远且未对齐。为什么？ 我已经为这个问题添加了一个 css 标签，以防万一它是 css 而不是 rails 的问题。

这是我的代码:

<%= form_for([@user, @submitted_quiz]) do |f| %>
<%= f.hidden_field :quiz_id, :value => @quiz.id %>
<%= f.hidden_field :name, :value => @quiz.name %>

<% @quiz.questions.each do |question| %>
<div class = "questions" >
<%= f.label question.content %>

<%= f.fields_for (:submitted_answers) do |ff| %>

<%= ff.hidden_field :question_id, :value => question.id %>
<div class = 'options'>
<% question.answers.each do |answer| %>
<div class = 'radio'>
<%= ff.radio_button :content, answer.content %>
<%= ff.label :content, answer.content %>

</div>
<% end #answer.each do %>
</div>
<% end #fields_for (:submitted_answers) do %>

</div>
<% end #questions.each do %>


<%= f.submit %>
<% end #form_for  %>

Answer 1

将单选按钮放在标签内并尝试。

<div class="radio">
  <%= ff.label :content do %>
    <%= ff.radio_button :content, answer.content %>
    <%= answer.content %> <!-- this will make the text appear after the radio button -->
  <% end %>
</div>

更新:

像这样

<label>
  <input type="radio" ... /> 
  Foo
</label>

此处 Foo 将出现在单选按钮之后，而不是之前。