一种选择是使用相对和绝对定位的混合：

#container{
    height:100%;
    position: relative;
}

#child1{
    height:35px;
}

#child2{
    overflow-y:auto;
    position: absolute;
    width: 100%;
    top: 35px;
    bottom: 0;
}

实际上根本没有设置高度，你让元素从顶部开始35px，从底部开始0px。
http://jsfiddle.net/AMQ8f/4/

另一种解决方案是使用calc：

#child2{
    overflow-y: auto;
    height: calc(100% - 35px);
}

http://jsfiddle.net/AMQ8f/1/
IE9+ http://caniuse.com/calc

您可以尝试使用calculate函数

height: calc(100%-35px)
      height: -webkit-calc(100%-35px)
      height: -moz-calc(100%-35px)

我从来没有真正使用过这个，可能不是所有的浏览器都支持这个，但我认为它可以工作。

有一个错误或我认为它是一个错别字在您的css overlow-y
创建一个函数来调整child2的高度，该函数将在页面加载时调用，并在改变container高度的事件中调用
DEMO & CODE

• • 注意：-**滚动小提琴输出容器下面有一个按钮来改变容器的高度

$(document).ready(function(){
    setHeight();

     $('#change').click(function () {
        $('#container').css('height', '300px');
        setHeight();
     });

});

function setHeight (){
    $('#child2').css('height', $('#container').height() - 35 + 'px');
    $('#child2').css('max-height', $(this).height())
}

我不明白你的问题，我猜你想让它滚动？如果是

child2{
overlow-y:scroll;
height: 100%;
}

希望这能帮上忙