Question

我有一个动态表，我在从用户那里获得一些输入后生成一些表格数据。我需要知道是否存在为细胞分配固定高度，即使它们中的一些具有一些内容/文本。我希望所有单元格的高度都是30px，无论它们是否有内容，或者它们是否为空。

这是我的CSS：

table {
  width: 90%;
  height:100%;

}
    table th,  table td {
      border: 1px solid gray;
      height:30px !important;
      padding: 9px !important;
      width: 16%;
    }

该表由此代码生成：

foreach ( $this->rows as $i => $row ) {
            $tbody_tr = NHtml::el ('tr class="data-row-' . $i . '"');
            foreach ( $this->fields as $field ) {
                $tbody_tr->add(NHtml::el ('td')->class($field['name'])->setHtml(@$row[$field['name']]));
            }

但是当我有一个有一些文本的单元格时，单元格高度无论如何都会扩展。有什么想法吗？

Answer 1

表格单元格不会溢出，因此您需要将内容包装在div中以使用溢出

以下是一个示例：http://jsfiddle.net/avVQm/

HTML：

<table>
 <tr>
  <td>
   <div>
    gf asfdg fsagfag fdsa gfdsg fdsg fds g fdg
   </div>
  </td>
 </tr>
</table>

CSS：

table {
    width: 30px;
    border: 1px solid black;
}

table td > div {
    overflow: hidden;
    height: 15px;
}

你的PHP：

foreach ((array)$this->fields as $field ) {
 $wrapperdiv = NHtml::el ('div');
 $tbody_tr->add($wrapperdiv);
 $wrapperdiv->add(NHtml::el ('td')->class($field['name'])->setHtml(@$row[$field['name']]));
}

请注意，我并不完全了解您使用的框架的语法，但我猜您的php看起来会像这样。

Answer 2

我通过删除表格单元格中的填充并添加规则高度：固定了它。

Answer 3

尝试将“overflow：hidden”添加到用于th / td的css。

无论细胞含量如何，表格细胞都固定高度

3 个答案: