Html CSS:Don'；如果不显示子元素'；不能完全装入容器中

我在这里模拟了这个问题的一个简单版本：

.container{
宽度：200px；
高度：400px；
背景颜色：鲑鱼；
溢出：隐藏；
}
.项目{
填充：20px；
边框：1px纯黑；
}

大字标题
副标题
Lorem ipsum dolor sit amet，是一位杰出的献身者。Donec hendrerit pulvinar孕妇。Donec porttitor congue sapien。奎斯克·尤伊斯莫·埃利芬德·托托。这是一种特殊的生活方式。这是一个很好的例子。这是一个很好的例子。箭矢状的等分在一个eleifend。rutrum dolor中，Nunc位于justo non metus发酵前庭。在faucibus中，Interdum和malesuada在第一次同侧前就出名了。库拉比图尔·康瓦利斯（Curabitur convallis），法雷特拉帝国饮食中的智人，尼西·夸姆·波苏尔·胡斯托（nisi quam posuere justo），一种叫尼西·泰勒斯·阿库（nisi tellus ac arcu）的调味品。毛里斯猫咪。在aliquet blandit euismod中。一方是一方，另一方是一方是一方，另一方是一方是一方。

正如您所说，欢迎所有建议，我有一个jquery解决方案：

$(function(){
 var x= 400-parseInt( $('.item').first().height()+$('.item').first().next().height());
    if($('.item').last().height()>x)
    {
        $('.item').last().hide()
    }
})

---

你能将预期结果显示为图像吗？只隐藏了第三项，所以：@Etash