代码之家 › 专栏 › 技术社区 › Bijay Regmi

在HAML/HTML中对齐表格的列

bootstrap-4 haml ruby-on-rails css html

-1

Bijay Regmi · 技术社区 · 9 年前

我正在制作一个动态填写的表格。当动态填充内容时,我可以得到空对象。当我得到空对象时,HTML表没有正确对齐。例如,我想创建一个如下表:

    Header1       Header2        Header3       Header4
                  Content12                    Content14
    Content21                    Content23     Content24
    Content31     Content32                    Content34

但目前,该表如下所示:

    Header1       Header2        Header3       Header4
    Content12     Content14
    Content21     Content23      Content24
    Content31     Content32      Content34

我研究的其他解决方案需要插入&存在空对象时的nbsp字符。如果我遵循这种方法,那么对于每个列,我必须检查给定的值是否为null,并插入&如果为空,则返回nbsp字符。我认为必须有其他有效的方法来做到这一点。有人能帮我处理这个案子吗?

P、 S:这是一个Ruby on Rails项目,我正在使用HAML和Bootstrap创建视图。此外,“我的内容”行包含一些额外的按钮,即“标题”行包含的列少于“内容”行

下面是我用来创建表的代码。

%table.table.table-hover.table-responsive
  %thead
    %tr
      %th ID
      %th Header1
      %th Header2
      %th Header3
      %th Header4
  %tbody
    -@given_objects.each do |obj|
      %tr
        %td= obj.id
        %td= obj.content1
        %td= obj.content2
        %td= obj.content3
        %td= obj.content4
        %td= link_to 'action1', action1_path(obj), class: 'btn btn-primary'
        %td= link_to 'action2', action2_path(obj), class: 'btn btn-primary'
        %td= link_to 'action3', action3_path(obj), class: 'btn btn-primary'

1 回复 | 直到 9 年前

Jay-Ar Polidario 9 年前

我感觉“something”已经覆盖了表单元格的默认CSS值 display 价值可能是自举?但我只能猜测。。。

但以下几点应该有效:

table.show-empty-cells {
  td:empty {
    display: table-cell !important;
  }
}

然后使用 .show-empty-cells 为您的桌子上课:

%table.table.table-hover.table-responsive.show-empty-cells

working example here

推荐文章

iiRosie1 · 非法嵌套:内容不能与%div位于同一行,也不能嵌套在其中

8 年前

Apzal Bahin · 有没有办法将haml文件与Watir一起使用

8 年前

eth3rnit3 · 引导navbar rails gem glypicon

8 年前

Bijay Regmi · 在HAML/HTML中对齐表格的列

9 年前

Rares R · Rails在HAML+Coffeescript中使用数组

9 年前

Snoobie Vishal Sareen · haml为输入字段赋值

9 年前

Snoobie Vishal Sareen · 如何在haml循环中打破?

9 年前

Computer Looker · 当我移动到下方的iframe上时,为什么这个下拉div会消失?

9 年前

Nell David Soledad · HAML条件缩进链接到具有相同内容的

9 年前

Sejista Carl · rails在变量中存储渲染视图

9 年前