单选按钮、未与标签垂直对齐的复选框(Rails 3)
单选按钮、未与标签垂直对齐的复选框(Rails 3)
提问于 2012-04-02 04:45:58
我一直在寻找这个问题的现有答案，但还没有找到。我目前正在做一个Rails 3项目，其中一些表单分别具有单选按钮和复选框的多项选择/多项选择问题。我使用表单生成器样式，如下所示：
<%= form_for [@profile,@answer], :method => 'put', :url => { :action => 'update' } do |f| %>
<% if @options.nil? %>
<%= @error_message %>
<% else %>
<% @options.each do |option| %>
<label for="<%= 'answer_response_' + option.downcase.gsub(' ','_') %>"><%= f.radio_button :response, option %><%= option %></label>
<% end %>
<% end %>
<div id="comments_area">
<p>Do you have any additional comments?</p>
<%= f.text_area :comments, :cols => 90, :rows => 5 %>
</div>
<%= submit_tag("Previous") %>
<%= submit_tag("Next") %>
<% end %>@options只是一个字符串数组，表示要显示的每个选项。
标签与各自的单选按钮/复选框连接在一起，工作正常。然而，无论我做什么，标签的文本似乎总是显示在下一行。示例：
Describe yourself:
[]
Short
[]
Fun
[]
Bored我已经尝试在f.RadioBUTTON/check_box之后使用f.label表单助手，它也有同样的问题。事实上，这就是为什么我要做上面的标签标签"HTML-style“(不使用ERB)的原因。这是一个可以用CSS解决的样式问题吗？如果是，如何将标签文本放在相应复选框/单选按钮之后的同一行中？
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-04-02 04:54:01
这可能是一个CSS问题，但更有可能是因为您在标签中放置了单选按钮，而单选按钮应该在标签之前或之后。
试着把这两个分开。如果这没有改变结果，请查看输入宽度-如果您的输入设置为覆盖整行，则会将文本推入下一行。要更改对齐方式，您还可以查看CSS关键字"inline“、"float”以及可能的“垂直对齐”。获取Firefox的Web开发人员扩展还可以帮助您找出CSS发生了什么，例如一个元素占用了多少空间。
Stack Overflow用户
发布于 2012-05-01 21:42:06
为了完整起见，这是如何使用内联样式(使用haml)来解决多行问题。
= f.check_box :eula_accepted
= f.label :eula_accepted, "I accept the EULA", :style => "display:inline"页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/9968188
复制相关文章
相似问题
腾讯云开发者
