html – IE9中的td max-width

2023年2月9日 229次阅读

我想限制表中列的宽度.

<!DOCTYPE html>
<style type="text/css">
table tr td {border:1px solid; max-width:2em; overflow:hidden; white-space:nowrap;}
</style>
<table>
    <tr><td>this is looooooooo ooooooooo ooooooooooooo ooooooooo ng text</td></tr>
</table>

下一个代码在Firefox中运行良好(单元格的宽度有限),但宽度不限于IE9.

最佳答案 您需要在td之后添加一个div,如HTML中的以下内容.该div中的任何内容都不会延伸到表格单元格.

Demo

<!DOCTYPE html>
    <table>
      <tr>
        <td>
          <div>
            this is looooooooo ooooooooo ooooooooooooo ooooooooo ng text
          </div>
        </td>
      </tr>
    </table>

CSS：

table tr td {
    border:1px solid;
    max-width:2em;
    overflow:hidden;
    white-space:nowrap;
}

div {
  width: 2em;
}

适用于IE8,Chrome和Firefox.

点赞