Rails 简单表单引导单选按钮答案

【问题标题】：Rails Simple Form Bootstrap Radio ButtonsRails 简单表单引导单选按钮
【发布时间】：2015-04-05 23:11:58
【问题描述】：

我在 rails 4 应用程序中使用简单的表单和引导程序。

我对此感到非常沮丧，以至于我无法弄清楚应该“简单”的东西。

我正在尝试让我的单选按钮显示：块。取而代之的是，文本都是内联的，并且相互压扁，因为容器太窄而无法将其全部放在一行中。

我的表单元素是：

    <%= f.collection_radio_buttons :public, [[true, 'Yes, anyone can view this project'] ,[false, 'No, I would like to invite specific recipients']], :first, :last,  {style:'display:block', class: "response-project"}  %>

我也试过了：

这些都不能禁用 Simple Form 或 Bootstrap 强加的格式。我还有其他表单元素是单选按钮，我想保持显示：内联。我可以从我的 google 检查元素中看到，表单元素上有一个 label.collection_radio_buttons 标记。我没有创建它，我在 css 文件中的任何地方都找不到它。它可能是从引导程序导入的，也可能是简单表单样式的一部分，但我不知道如何从表单元素中解除它。

谁能帮忙？

谢谢

【问题讨论】：

终于找到答案了。我没有意识到我需要编写一个样式如下的项目包装类：.fixradio { display: block;输入[类型=收音机] {边距：0px 5px 0px 5px;显示：内联； } label.radio { margin-right: 5px; } }

标签： css ruby-on-rails twitter-bootstrap simple-form

【解决方案1】：

如果你想让你的 CSS 工作，你必须使用 input_html 或 label_html。所以它会是这样的：

<%= f.collection_radio_buttons :public, [[true, 'Yes, anyone can view this project'] ,[false, 'No, I would like to invite specific recipients']], :first, :last,  :input_html => {style:'display:block', class: "response-project"}  %>

*label_html 是只影响标签div 无论如何，您应该阅读“使用”部分下的文档https://github.com/plataformatec/simple_form。希望这会有所帮助。

【讨论】：

谢谢伍迪。我确实阅读了简单的表单文档，但不知道如何调整这些示例。我终于找到了如何使用项目包装类来获得我在单个单选按钮上的样式。