2 
<style>
        .topTable
        {
            border-top:1px solid #333333;
            border-right:1px solid #333333;
        }

        .topTable td, th
        {
            border-left:1px solid #333333;
            border-bottom:1px solid #333333;
        }

        .topTable .inner
        {
            border-width:0px;
            position:relative;
            top:0px;
            left:0px;
            height:100%;
            width:100%;
        }
        .topTable .container
        {
            padding:0px;
            border-width:0px;
            position:relative;
        }
    </style>

    <table cellpadding="4" class="topTable" cellspacing="0" style="background-color:#f0f0f0;">
        <tr>
           <th>Option A</th>
           <td class="container">
                <table cellpadding="4" class="inner" cellspacing="0" style="background-color:#f0a0a0;">
                     <tr>
                        <td>Part 1</td>
                        <td>Part 2</td>
                     </tr>
                </table>
           </td>
           <td class="container">
                <table cellpadding="4" class="inner" cellspacing="0" style="background-color:#a0f0a0;">
                     <tr>
                        <td>Part 3</td>
                     </tr>
                     <tr>
                        <td>Part 3</td>
                     </tr>
                </table>
           </td>
           <td>Done</td>
        </tr>
    </table>

TD内のこれらのテーブルをheight：100％にする必要がありますが、何も機能していないようです。この場合、データは各サブテーブルで動的になるため、行スパンを使用することはできません。それらのテーブルが格納されているtdの全高を占めるように強制するCSSが必要です。ブロック要素を扱っているのでこれは簡単だと思いましたが、単に機能していないため、何かが欠けている必要があります。私がどんなトリックをしようとしても。

4

2 に答える 2

1

これは私ができる最善のことです：http： //jsfiddle.net/jc5qf/2/

それがあなたが正しい道を進むようになることを願っています。

于 2012-05-08T14:39:22.743 に答える
0

jQueryを使用して回避策を見つけました。

誰かがこれに似たものを投稿し、私はこれらのニーズを満たすためにそれを変更しました：

$(function () {
        $('td.container').each(function () {
            var $this = $(this);
            var panelheight = $this.height();
            $this.children('table.inner').height(panelheight);
        })
    });

tdを含む各クラスのクラスを「container」にし、そのコンテナの高さを「inner」に一致させるためにストレッチする必要があるその中のテーブルを作成する必要があります。このjQueryはそこから引き継ぎます。

于 2012-05-24T15:07:16.357 に答える