CSS Transition，为什么不折叠父div崩溃子元素呢？

Question

我是css过渡的新手，我正在尝试使用CSS transition折叠固定的popover div。能够成功折叠外部div，但是没有折叠其中包含的元素。这是预期的吗？我该怎么做才能彻底崩溃“有用吗？”酥料饼？ 这是掠夺者 http://plnkr.co/edit/FYbeIe7IY41Ik3LBcf1r?p=preview

Answer 1

只需将overflow: hidden提供给固定元素即可。

像这样：

.feedback-popover {
    position: fixed;
    width: 50%;
    overflow: hidden;
    border: 1px solid;
    right: 32px;
    background-color: #dcdcdc;
    z-index: 1030;
    top: 66px;
    max-height: 350px;
    -webkit-transition: max-height 0.5s ease-in-out;
    -moz-transition: max-height 0.5s ease-in-out;
    -o-transition: max-height 0.5s ease-in-out;
    transition: max-height 0.5s ease-in-out;
}

.feedback-popover-collapse {
    position: fixed;
    overflow: hidden;
    width: 50%;
    right: 32px;
    background-color: #dcdcdc;
    z-index: 1030;
    top: 66px;
    max-height: 0px;
    -webkit-transition: max-height 0.5s ease-in-out;
    -moz-transition: max-height 0.5s ease-in-out;
    -o-transition: max-height 0.5s ease-in-out;
    transition: max-height 0.5s ease-in-out;
    }