底部css屬性使項目消失

我正在試圖弄清楚這一點的CSS風暴。底部css屬性使項目消失

我有這樣的代碼

.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; 
    } 

}

然後我在我的標記

<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>

這納克級的方法，當我在Chrome瀏覽器開發工具和更改bottom屬性，以50像素它的工作原理。但是，當我通過ng-click添加'collapse'類時，該項只是POOFS並消失。有任何想法嗎？「

來源

2016-03-26 Garuuk

發生什麼當你從開發工具中添加'collapse'類（不僅僅是底部樣式）？ –

它也消失了。就好像我點擊了ng鍵。 – Garuuk

從閱讀的評論，我不知道到底爲什麼該項目會消失，但如果你說，它與直接設置在底部的風格，那麼你可以這樣做，而不是：

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

來源

2016-03-26 22:58:35

感嘆，這個作品。謝謝。當我覺得我搞砸了一些東西的時候，我總是走錯了兔子洞。 – Garuuk

底部css屬性使項目消失

回答

相關問題