HTML单元格中的按钮位于同一行

时间:2015-03-02 22:05:57

标签: html css ruby-on-rails twitter-bootstrap

我在同一个表格单元格中有两个按钮来编辑和删除用户。现在它导致换行而不是两者都在同一条线上。我能解决这个问题吗?我的代码在HAML中用于Rails应用程序,我正在使用Twitter Bootstrap。

用户索引页:

%h1.text-center Users
%br
.col-md-6.col-md-offset-3
  %table.table
    %th First Name
    %th Last Name
    %th E-Mail
    %th User
    %th Modify
    - @users.each do |user|
      %tr(id="user#{user.id}_row")
        %td= user.first_name
        %td= user.last_name
        %td= user.email
        %td= user.type
        %td{ min_width: '100px;'}
          =edit_user_button(user) + (delete_user_button(user) if is_admin?)

这是生成按钮的辅助类:

require 'action_view/helpers/url_helper'

module UsersHelper
  def edit_user_button(user)
    button_to 'edit', edit_user_path(user), class: 'btn btn-default'
  end

  def delete_user_button(user)
    button_to 'delete', destroy_user_path(user), 'method' => :delete, data: {confirm: "Are you sure you want to delete #{user.first_name} #{user.last_name}?"}, class: 'btn btn-default'
  end
end

1 个答案:

答案 0 :(得分:0)

它不是换行符,表格单元格太小,所以要使表格单元更宽。

%td{:min_width => "100px;"}