html - IE7/8中的表格宽度

Question

让我的表格在不同的浏览器上看起来正确让我发疯了，就在我认为我进入一个浏览器时它在另一个浏览器中发生了变化。 IE7/8 和 Firefox 是我的目标浏览器。

有人可以看一下代码吗？我只是想不通问题出在哪里。表格由 Javascript 生成，我需要它具有 220px 的固定宽度，主要问题是 tfoot，我有 3 个 tds，我无法控制宽度。

这是代码的相关部分:

<table class="favouritelinks"  cellspacing="0" cellpadding="0" width="220" >

<thead>
    <tr><td colspan="3">Your Favourite Links</td></tr>
</thead>
<tbody id="tulemused" ></tbody>


    <tr>
        <td width="50">Name</td><td><input type="text" id="key" name="key" value="" /></td>
        <td rowspan="2"><a href="javascript:insert_value()"><div class="addimg"></div></a></td>
    </tr>
    <tr>
        <td width="50">URL</td><td><input type="text" id="val" name="val" value=""  /></td>

    </tr>


</table>

和CSS:

.favouritelinks td{
                height: 20px;
                padding: 3px;

                border-bottom: 1px solid white;
                word-break: break-all;


            }
            .favouritelinks td a{
                color: white;
                text-decoration: none;


            }
            thead{
                background: url(img/title5.png) no-repeat;
                color: #444;
                font: bold 16px Helvetica;
                text-shadow: 0 1px 0 #FFF;
                text-align: center;
                width: 220px;
                height: 36px;


            }
            thead tr {
                height: 36px;

            }
            .container{
                width: 220px;
                margin-top: 105px;
                margin-left: 10px;


            }
            .delimg {

                background: url(img/details_close.png) no-repeat;
                width: 20px;
                height: 20px;
                float: right;
            }
            .addimg {
                background: url(img/details_open.png) no-repeat;
                width: 20px;
                height: 20px;
                float: right;
            }
            .urls {
                display: none;

            }

我做错了什么？

图片http://imageshack.us/photo/my-images/38/56751263.jpg/

Answer 1

在你的 CSS 中试试这个:

table {
    table-layout: fixed;
}