Label is getting displayed below checkbox

问题

<%= f.check_box :openid_enabled %>
<%= f.label :openid_enabled, 'OpenID' %>

Above code generate this HTML

<input type="hidden" value="0" name="application[openid_enabled]">
<input type="checkbox" value="1" name="application[openid_enabled]" id="application_openid_enabled">
<label for="application_openid_enabled">OpenID</label>

and the label is getting displayed like

[x]
OpenID

instead of

[x] OpenID

Do I need to style it or rails helpers have some build in functionality?

Added

I am using twitter bootstrap CSS framework in my Rails application.

回答1:

I used following to fix the issue without overriding style of twitter bootstrap css.

<%= f.label :openid_enabled, class: 'checkbox' do %>
  <%= f.check_box :openid_enabled %>
  OpenID
<% end %>

Which generates following HTML

<label for="application_openid_enabled" class="checkbox">
  <input type="hidden" value="0" name="application[openid_enabled]">
  <input type="checkbox" value="1" name="application[openid_enabled]" id="application_openid_enabled">
  OpenID
</label>

Here is reference http://twitter.github.com/bootstrap/base-css.html

Thanks @MyHeadHurts and @Dipaks for your invaluable inputs.

回答2:

This must be happening because either input or label is set as display: block; You can show it in one line by making these elements inline -

input, label{ display: inline; }

回答3:

I know its old but the best way to do it today would be to use the checkbox-inline class on the label.

来源：https://stackoverflow.com/questions/12036473/label-is-getting-displayed-below-checkbox