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% 并且似乎没有任何效果。在这种情况下,我不能使用 rowspan,因为每个子表中的数据都是动态的。我需要一些 CSS 来强制这些表格占据它们存储的 td 的全部高度。我认为这很容易,因为我正在处理块元素,但我必须遗漏一些东西,因为它根本不起作用不管我尝试什么技巧。

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 的类设置为“容器”,并且其中的表需要拉伸以将该容器的高度匹配到“内部”这个 jQuery 将从那里接管。

于 2012-05-24T15:07:16.357 回答