IE6,7和8中的CSS最小宽度

Aar*_*ron 15 css internet-explorer

我在Google上找到了很多关于这个问题的答案,但它们似乎都不适用于所有浏览器.

我正在寻找一种只有CSS的方法来获得Firefox,IE6,IE7和IE8的最小宽度.众所周知,IE不支持min-width,因此有几个hacks试图模拟min-width的行为.不幸的是,我没有运气.

具体来说,这就是我想要做的:

<style type="text/css">
    table.dataTable td {
        white-space: nowrap;
    }

    table.dataTable td.largeCell {
        white-space: normal;
        min-width: 300px;
    }
</style>

<table class="dataTable">
  <tr>
    <td>ID</td>
    <td>Date</td>
    <td>Title</td>
    <td class="largeCell">A large amount of data like a description that could
        span several lines within this cell.</td>
    <td>Link</td>
  </tr>
</table>
Run Code Online (Sandbox Code Playgroud)

有没有人有办法让这个工作?

Aar*_*ron 14

因此,事实证明,在所有浏览器中使min-width工作所必需的黑客并不像许多人那样难以实现.

我所要做的就是为其中的div添加CSS,largeCell并在单元格的末尾添加一个空div.div只有1px高,所以它并没有真正使单元看起来比应有的大.

<style type="text/css">
    table.dataTable td {
        white-space: nowrap;
    }

    table.dataTable td.largeCell {
        white-space: normal;
        min-width: 300px;
    }

    table.dataTable td.largeCell div {
        margin: 0px 0px 0px 0px;
        height: 1px;
        width: 300px;
    }
</style>

<table class="dataTable">
  <tr>
    <td>ID</td>
    <td>Date</td>
    <td>Title</td>
    <td class="largeCell">A large amount of data like a description that could
        span several lines within this cell.
      <div></div>
    </td>
    <td>Link</td>
  </tr>
</table>
Run Code Online (Sandbox Code Playgroud)


fir*_*ire 7

我用:

min-width: 200px;
_width: 200px; /* IE6 */
Run Code Online (Sandbox Code Playgroud)