1

以下のように私のコードフラグメントを見つけてください：

<table cellpadding="0" cellspacing="0" style="background-color:Aqua">
    <tr>
        <td>
            <div style="background-color:Yellow">Navigation</div>
        </td>
        <td>
            Content<br />Content<br />Content<br />Content<br />
        </td>
    </tr>
</table>

<div>のコンテンツの成長と同じ高さにするにはどうすればよい<td>ですか? と で height=100% または AUTO を設定しようとしまし<div>た<td>が、問題は解決しません。

jQuery/JavaScript を使用してコンテンツの高さを取得し、に設定することで修正できることはわかっています<div>。次に例を示します。

$(".divClass").height($(".contentClass").height());

しかし、私のコンテンツはユーザーの操作によって折りたたまれたり展開されたりするので、より良い修正を探しています。ソリューションは、IE 6 から IE 10 までのクロス ブラウザ互換性を備えている必要があります。

4

2 に答える 2

1

使ってみてくださいheight:inherit;:)私のために働いた:)

Jsフィドル。

HTML:

<div class="foo">
    <div class="foo2">
        Foo2
    </div>
</div>

CSS:

.foo {
    height: 100px; /*try changing this */
    background-color: yellow; /*it wont show*/
}

.foo2 {
    height: inherit;
    background-color: green; /*it will show*/
}
于 2013-07-04T10:09:46.583 に答える
1

HTML/CSSで直接行うことができます

<table cellpadding="0" cellspacing="0" style="background-color:Aqua">
    <tr>
        <td>
            <span style="height:100%; display:inline-block; width: 100%; background-color:Yellow">
                Navigation
            </span>
        </td>
        <td>
            Content<br />Content<br />Content<br />Content<br />
        </td>
    </tr>
</table>
于 2013-07-04T10:08:07.760 に答える