0

初め; こことネットでこれを検索しましたが、有効な解決策が見つかりませんでした。私はこの問題に文字通り 2 日間取り組んでいるので、質問しなければなりません。

私は次の問題を抱えています：

    <table width="650px" border="1" >
    <tr>
        <td style="height :5px">stay as you are</td>
        <td rowspan="3" id="content">
            empty
        </td>
    </tr>
    <tr>
        <td style="height :5px">please dont expand</td>
    </tr>
    <tr>
        <td style="background: red;height : 100%;">&nbsp;</td>
    </tr>
</table>
<input type="button" value="do" onclick="dontExpand()">
<script language="Javascript">
    function dontExpand() {
        var html = "";
        for (var i = 0; i < 100; ++i)
            html += "lorem ipsum<br>";
        document.getElementById("content").innerHTML = html;
    }
</script>

問題の JSFiddle の例は、Chrome でのみ機能します

コンテンツが Javascript によって動的に変更された後、左上と中央の左のセルが展開されます。

DocTypes と何か関係があると思いますが、私は専門家ではありません。

左下のセルのみを展開するように Internet Explorer と Firefox を作成する方法はありますか? 上記の他の 2 つのセルはそのままにしておく必要があります。

助けが必要です。

4

3 に答える 3

0 
var height = document.getElementById("content").offsetHeight; // to determine the content height.
table.style.height = height + 10 + "px";

さらにこれを行うのは IE の場合のみで、height:100% を削除すると他のブラウザで動作します

于 2013-02-06T11:02:07.617 に答える
0

では、最初の 2 つのセルの高さは 5px にしかならないのでしょうか? FF では、3 番目の td から height:100% を削除すると機能します。

編集: 100% の代わりに、最後の div に height:640px を書き込むと、うまくいきます。テーブル全体の高さが 650px であることがわかっているので、問題にはなりません。

于 2013-02-06T09:03:53.857 に答える
0

ここで同じ問題を見てください: rowspan を使用しているときに IE の行の高さの設定が機能しない

1つの解決策は、コンテンツを追加した後の合計の高さに基づいてコンテンツを更新した後、最後のテーブル列の高さを変更することだと思います-10 px ?

于 2013-02-06T09:12:45.377 に答える