将button_to与文本内联:twitter-bootstrap-rails

时间:2013-04-26 16:08:31

标签: ruby-on-rails twitter-bootstrap view

男士和女士,

我使用2个按钮和文本渲染部分,并尝试使用twitter bootstrap将这几个按钮放在与我的文本相同的行上。部分档案:

<div class="well pull-right inline">
<% if logged_in? %>
    Logged in as <%= session[:user] %>. <%= button_to 'Logout', logout_path, :class => "btn btn-danger", :form_class => "form-inline form-horizontal" %>
<% else %>
    Welcome Guest! <%= button_to "Login", login_path, {:class => "btn btn-success inline", :form_class => "form-inline form-horizontal"} %>
    or <%= button_to 'Register', register_path, {:class => "btn btn-primary inline", :form_class => "form-inline form-horizontal"} %>
<% end %>
</div>

同样适用于用户登录时呈现的注销按钮。我尝试在button_to类及其form_class中放置各种内容,到目前为止没有任何工作,每个按钮都打开自己的路线。任何帮助或提示非常感谢!

4 个答案:

答案 0 :(得分:8)

您可以使用以下语法访问button_to帮助程序创建的表单的样式属性:

<%= button_to "Login", login_path, form: {style: 'display:inline-block;'}%>

答案 1 :(得分:6)

Rails生成一个带有button_to内部div的表单。要使其内联,您需要将表单和div更改为内联。在你的CSS中,添加

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

答案 2 :(得分:5)

尝试将button_to更改为link_to并仔细检查css是否包含position: relative; display: inline之类的内容。您也可以检查div是否够宽!

答案 3 :(得分:3)

如果由于任何原因您无法将button_to替换为link_to,则以下方法适用于我:

<div style="display:inline-block;">
  <%= button_to "Text", action: "some_action" %>
</div>