CSS父Div高度:auto，子Div高度100%，但高度为0px

Question

我有一个侧边栏菜单，我有一个切换按钮，但我有一个div，是侧边栏的父div，高度由Node Package设置为'auto'。

<div _ngcontent-cle-1="" class="sidebar in collapse" style="overflow: visible; transition-duration: 500ms; height: auto;" aria-expanded="true" aria-hidden="false">
</div>

如果高度设置为100%，则div将移至屏幕底部，这是需要的。但是由于"auto"被强制加入，那么高度只会与条目的数量一样高。

为了解决这个问题，我尝试添加一个子元素将父div的高度强制放到底部。

我已经尝试了多种css技巧，如display: table和display: table-row，但div只是保持在0px的高度，无论什么

还要注意:父div类中设置的任何高度样式都会被覆盖。

EDIT它不是另一个答案的重复，这样做的原因是因为它有冲突的样式从另一个，这是缩短的高度，我想覆盖它或使子元素是100%的高度，从而迫使父元素扩展，因为自动高度。

Answer 1

这个问题已经解决了，因为Angular2指令包含:

this._renderer.setElementStyle(this._el.nativeElement, 'height', 'auto');

覆盖了这个css的高度:

.sidebar {
    background-color: #0080ff;
    top: 0;
    left: 0;
    padding-top: 50px;
    height: 100%;
    float: left;
    position: fixed;
    width: 84px;
}

<<p> 解决方案/strong>

.sidebar {
    background-color: #0080ff;
    top: 0;
    left: 0;
    padding-top: 50px;
    height: 100% !important;
    float: left;
    position: fixed;
    width: 84px;
}

重要属性确保100%属性不能被覆盖。@DamianBartosik建议