3

私はこのトピックを見つけました。私のものは関連していますが、同じではありません：

IE9 の tds での cols と colspan を使用したテーブル レンダリング

私が抱えている問題は、テーブルの 2 番目の colspan=2 が IE9 によって読み取られないことです。おかしなことに、IE7 と IE8 では機能しますが、IE9 では機能しません。たぶん私は何か完全に間違ったことをしたので、ここにあります：

HTML:

<table id="test">
    <tbody>
        <tr>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
        </tr>
    </tbody>
</table>

CSS:

#test {
    width: 100%;
    border-spacing: 20px;
    border-collapse: separate;
    table-layout: fixed;
}

#test td {
    position: relative;
    background-color: #cccccc;
    box-shadow: 3px 3px 2px rgba(0,0,0,0.5);
    padding: 10px;
}

jsFiddle: http://jsfiddle.net/DUCPp/1/

何が起こるはずですか： ここに画像の説明を入力

IE9が私に与えるもの： ここに画像の説明を入力

これは IE9 のバグだと確信していますが、Google で見つけることができませんでした (適切なキーワードを検索していないのでしょうか?)。バグレポートへの解決策やリンクは大歓迎です!

更新: 2 番目の colspan=2 列の後に追加の列を追加したところ、正しくレンダリングされます。行の最後の列が colspan > 1 の場合、colspan = 1 としてのみレンダリングされると推測しました。

修正に関するアイデアはありますか？私はこれが IE9 のバグであることをほぼ確信しています <_<

4

4 に答える 4

2

ええと...IE9..。

「修正」が見つかりました...アイデアは次のとおりです。1つの行のセルのColspanが、他のすべての行のTD幅の設定を妨げているようです。なんで？

基本的に、正しい数の空のセルを含む空の行を追加する必要がありました。

<table id="test">
    <tbody>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
        </tr>
    </tbody>
</table>

きれいではありません...そして、セルが表示されないようにするために、セルのパディングを削除する必要がありました。はぁ...

jsFiddle： http: //jsfiddle.net/DUCPp/5/

于 2013-03-12T19:28:45.207 に答える
0

列の固定幅を定義していないようです。の前に次のようなものを使用する必要があります<tbody>。

<col span="6" style="width:16%;" />
于 2013-03-12T19:24:15.620 に答える