ボトムCSSプロパティはアイテムが消えるようにします

Question

私はこれを理解しようとしているCSSの暴風にいます。

私はクロームのdevのツールにだとそれが動作は50pxするbottomプロパティを変更すると、私は私のマークアップ

<div class="spectator-chat-title" ng-class="{'collapse':chatHide}"> 
     <i ng-click="chatHide = !chatHide" ng-class="{'fa-angle-double-down':!chatHide, 'fa-angle-double-up':chatHide}" class="fa pull-right"></i> 
</div> 

にこのNGクラスのメソッドを持っているし、このコード

.spectator-chat-title{ 
    background-color: darken($content-container-bg, 5%); 
    height: 30px; 
    padding: 3px; 
    color: #ddd; 
    border-top: 1px solid #1C2337; 
    box-shadow: 0px 1px 1px darken($content-container-bg, 10%); 
    z-index: 1001; 
    position: absolute; 
    width: 100%; 
    bottom: 0; 

    &.collapse{ 
     bottom: 50px; 
    } 

} 

を持っています。しかし、ng-clickで 'collapse'クラスを追加すると、アイテムはPOOFSになり、消えます。何か案は？コメントを読んでから、

Answer 1

正確にアイテムが消えた理由を、私は知らないが、あなたはそれが直接、下のスタイルを設定することで動作することを言う場合は、あなたの代わりにこれを行うことができます：

<div class="spectator-chat-title" ng-style="{'bottom': chatHide ? '50px' : ''}">