Rails：如何使“按钮到”按钮出现在同一行（没有换行符）？答案

【问题标题】：Rails: How to make "button_to" button to appear on the sameline (without a newline)?Rails：如何使“按钮到”按钮出现在同一行（没有换行符）？
【发布时间】：2011-05-13 08:07:21
【问题描述】：

我有一个块迭代器来显示用户和相关操作，每次迭代都显示在同一行？
您可以像这样可视化：-

user1  update_attribute_button
user2  update_attribute_button.
...
and so on.

但如果我使用 button_to 方法，按钮就会显示在换行符上。这是我不想要的。这是我的代码 sn-p:-

<% @post.bids.each do |bid| %>
<p>
<%= bid.user.email %>   
<%= button_to "Offer Bid", offer_bid_post_bid_path(@post, bid), :action => "offer_bid">
</p>
<% end %>

但是使用上面的代码，“电子邮件”和“报价”出现在两行中，但我想将它们成对显示，每一对出现在一行中。

我可以使用“link_to”来实现它。
如果我使用 'link_to' 而不是 'button_to' 我可以实现我的想法，但不能使用 button_to 来实现。为什么 link_to 和 button_to 有这种区别。
我只想将“报价”显示为按钮。
现在，如何使 button_to 按钮与“电子邮件”出现在同一行。

如果问题的描述不清楚，请告诉我。提前致谢。

【问题讨论】：

标签： ruby-on-rails css ruby-on-rails-3 view

【解决方案1】：

button_to 在按钮周围生成一个表单和一个 div。因此，如果您不限制按钮之前的容器宽度，则按下按钮将占用 100% 的宽度。

"offer_bid" %>

【讨论】：

【解决方案2】：

这与 Rails 无关，而是与 Web 浏览器的呈现形式有关。

button_to 只是一种创建带有不可见字段的表单的便捷方式。如果您希望表单与电子邮件地址位于同一行，则需要将其放入容器中，通常是 div，将 div 设置为向左浮动并溢出隐藏。

【讨论】：

【解决方案3】：

button_to 呈现为表单标签，因此我只是更改了 CSS 以确保表单标签不会创建新行。

但要将其仅应用于特定的表单标签，然后添加 form_class: "myButton" 见下文。

在你的 something.html.erb 中

<%= button_to "Offer Bid", offer_bid_post_bid_path(@post, bid), :action => "offer_bid", form_class: "myButton">

把这个放在你的application.css

myButton {
    display: inline;
}

【讨论】：

这就像一个魅力！从 Rails 6.1 开始，button_to 的表单标签的默认类名为 button_to。因此，除非您想完全覆盖默认 CSS，否则form_class: "inline_form button_to" 会更好。顺便说一句，答案中缺少结束双引号。