Question

我对列有以下标记：

<table class="b-hdfs__files-list">
    <colgroup>
        <col span="1" class="b-hdfs__files-list__item-property-col-width-selected">
        <col span="1" class="b-hdfs__files-list__item-property-col-width-type">
        <col span="1" class="b-hdfs__files-list__item-property-col-width-name">
        <col span="1" class="b-hdfs__files-list__item-property-col-width-size">
        <col span="1" class="b-hdfs__files-list__item-property-col-width-user">
        <col span="1" class="b-hdfs__files-list__item-property-col-width-group">
        <col span="1" class="b-hdfs__files-list__item-property-col-width-permissions">
        <col span="1" class="b-hdfs__files-list__item-property-col-width-date">
    </colgroup>

和CSS：

.b-hdfs__files-list .b-hdfs__files-list__item-property-col-width-selected {
  width: 50px;
}
.b-hdfs__files-list .b-hdfs__files-list__item-property-col-width-type {
  width: 50px;
}
.b-hdfs__files-list .b-hdfs__files-list__item-property-col-width-name {
  width: 50px;
}
.b-hdfs__files-list .b-hdfs__files-list__item-property-col-width-size {
  width: 50px;
}
.b-hdfs__files-list .b-hdfs__files-list__item-property-col-width-user {
  width: 50px;
}
.b-hdfs__files-list .b-hdfs__files-list__item-property-col-width-group {
  width: 50px;
}
.b-hdfs__files-list .b-hdfs__files-list__item-property-col-width-permissions {
  width: 50px;
}
.b-hdfs__files-list .b-hdfs__files-list__item-property-col-width-date {
  width: 50px;
}

但是尽管每列都与预期的相同，但它们不是50px宽，而是33px。我想知道为什么。这是fiddler，包含完整的标记和样式。

Answer 1

因为您为表格提供了100％的宽度，所以它会根据它进行调整。因此，移除width:100%;中的.b-hdfs__files-list并为width: 100px;提供col（您的选择）。

Answer 2

问题在于：

.b-hdfs__files-list {
  width: 100%;
}

请尝试使用此代码：

.b-hdfs__files-list {
  width: auto;
}

Answer 3

我不确定这会有效，但我认为它会：

[self.tableView reloadData];

DEMO

Answer 4

您可以在表格中添加table-layout: fixed

列的宽度与样式中指定的宽度不同

4 个答案: