在ngx数据表上使用flex模式时如何固定固定宽度

时间:2019-06-21 07:16:33

标签: angular angular7 ngx-datatable

我对ngx-datatable flex模式有疑问。当我在桌子上添加一些媒体查询时,固定宽度的踢出最后一个元素,我该如何解决这个问题? 我想以相同的宽度划分列。但是结果如下:

enter image description here

以下是一些摘要:

@media screen and (min-width: 769px) and (max-width: 1160px) {
    .datatable-body {
      display: flex;
      flex-wrap: wrap;
      overflow-x: scroll;
      &-cell {
        flex: 0 0 20%;
        max-width: 20%;
        width: auto !important;
        min-width: 20% !important;
        white-space: normal !important;
        font-size: 12px;
        &.is_hidden {
          display: none;
        }
      }
    }

    // .datatable-scroll,
    // .datatable-row-wrapper,
    // .datatable-body-row,
    // .datatable-header-inner {
    //   width: 100% !important;
    // }

    .datatable-scroll {
      width: 100% !important;
    }

    // All column will same width
    .datatable-header {
      &-cell {
        flex: 0 0 20%;
        max-width: 20%;
        width: auto !important;
        min-width: 20% !important;
        font-size: 12px;
        &.should_be_hidden {
          display: none;
        }
      }
    }
  }

有什么建议吗?

0 个答案:

没有答案