0 
<body style="width: 100%; text-align: center;">
    <div style="margin: 0 auto;">container
        <div style="width: 200px; margin-top: 100px; float: left;">
            left
        </div>
        <div style="width: 728px; float: left;">
            <div style="height: 100px;">
                1
            </div>
            <div style="height: 150px;">
                2
            </div>
            <div style="margin-bottom: 0; bottom: 0; height: 100%;">
                3
            </div>
        </div>
    </div>
</body>

DIV1有一个固定的高度，

DIV2通过 jQuery 改变它的高度

DIV3必须尽可能地伸展，在2下降到bottom: 0;

缺少哪些样式3？

我也想container居中。

4

2 回答 2

0

感谢删除他的答案的那个人，它快要开始工作了。 height以某种方式被忽略了，但是使用它top并且position: absolute;它起作用了。当 DIV2调整大小时，必须有一个事件触发调整 DIV 大小3：

<body style="width: 100%; text-align: center;">
    <div style="margin: 0 auto;text-align:center">container
        <div style="width: 200px; margin-top: 100px; float: left;">
            left
        </div>
        <div style="width: 728px; float: left;">
        <div style="height: 100px;" id="a">
            1
        </div>
        <div style="height: 150px;" id="b">
            2
        </div>
        <div style="background-color: red; position: absolute; bottom: 0;" id="test">
            3
        </div>
    </div>
</div>
<script>
    $(document).ready(function() {
        $('#test').css('top', $('#a').height() + $('#b').height());
    });
</script>

于 2013-07-04T09:54:43.173 回答
0

这可以在没有 Javascript 的情况下完成css tables

小提琴

于 2013-07-04T09:56:29.647 回答