HTML问题：之前导致换行的表单（Rails button_to）

The button_to causes a line break before it in HTML. I have found a workaround which will work, but it's hardly ideal, because then the buttons are NOT real buttons. Is there any other way to avoid the line break before the form?

button_to在HTML中导致换行符。我找到了一个可行的解决方法,但它并不理想,因为那时按钮不是真正的按钮。有没有其他方法可以避免表格前的换行?

Here's the resulting HTML

这是生成的HTML

<a href="/last_page">Back</a> | 
<form method="post" action="/next_page" class="button-to">
<div><input type="submit" value="Continue" /></div>
</form>

any help from the CSS side or the Rails side would really help!

CSS方面或Rails方面的任何帮助都会有所帮助!

7 个解决方案

#1

Ensure the CSS for that div is set to

确保该div的CSS设置为

display: inline;

#2

To only affect the button_to class and its inner div:

要仅影响button_to类及其内部div:

.button_to {
  display: inline;
}

.button_to div {
  display: inline;
}

#3

the button_to creates an HTML < form > element, which is a block element in HTML. If you give the form a class or id, you build your css selector to get the form and use:

button_to创建一个HTML

form {
display: inline
}

#4

Got it from somewhere out there. Happily:

从那里的某个地方得到它。令人高兴的是:

.button-to { display:inline-block;}

#5

None of these options worked for me on Rails 3.2.3 ! I found a working solution at http://www.deploymentzone.com/2011/12/07/button_to-urlhelpers-all-in-a-row/

在Rails 3.2.3中,这些选项都不适用于我!我在http://www.deploymentzone.com/2011/12/07/button_to-urlhelpers-all-in-a-row/找到了一个可行的解决方案

Here it is:

这里是:

/* ./app/assets/stylesheets/button_to.css.scss */

form.button_to {
    margin:0;
    padding:0;
    display:inline;
}

form.button_to div, form.button_to div input {
    display:inline;
}

#6

You still have to specify inline for the div and the form.

您仍然必须为div和表单指定内联。

div {
  display: inline;
}

.button-to {
  display: inline;
}

Wouldn't it be nicer if class="button-to" was also specified in the div ? or am I missing something ?

如果在div中也指定了class =“button-to”,那会不会更好?还是我错过了什么?

#7

A button_to generates a form and a div around the button. So, if you do not restrict the width of the container which is before the button, it will take 100% of the width pushing the button down.

button_to生成表单和按钮周围的div。因此,如果您不限制按钮之前的容器宽度,则按下按钮需要100%的宽度。

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

#1