html - IE9 中的 td 最大宽度

标签 html internet-explorer-9

我想限制表格中列的宽度。

<!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 中的任何内容都不会拉伸(stretch) table 单元格。

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 中运行良好。

关于html - IE9 中的 td 最大宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14564001/

相关文章:

javascript - 如何使用 javascript 将 id 分配给 HTML <li> 元素?

javascript - 防止错误提示 xss 上的 img 标记以获取 GET

html - 如何使用 css 颜色属性动态覆盖字体颜色

html - 在具有两个按钮的 HTML 表单上,如何让一个按钮提交表单而另一个按钮不提交?

cross-browser - Soundcloud HTML5 播放器未显示在 IE9 中

JavaScript 变量名称和 HTML 输入名称属性 : namespace collision?

html - 为什么图像不显示?

css - 在 IE9 中从 div 中删除图像标签

javascript - 如何检测一个对象是否具有某种属性?

html - 删除 IE 9 图片链接框