跨越父按钮高度的 100%

我有以下标记

<button class="filter"><div class="radio"><div class="circle"></div></div> <span>Account Management</span></button>

and CSS

.filter {
    font-size: 3vw;
    text-align: left;
    line-height: 1.6;
    padding: 0px;
    display: block;
    height:auto;
    overflow: hidden;
    margin-bottom: 3px;
}
.filter span {
    background: $leithyellow;
    height: 100%;
    overflow:auto;
    display: block;
    width: calc(100% - 60px);
    float: left;
    margin-left:10px;
    padding-left:20px;
}

我无法将跨度扩展到按钮的 100% 高度。这可以做到吗？

1. Set display: flex给家长
2. Set align-self: stretch为了孩子

这将拉伸子 div/按钮的高度以适应其父级的高度，而不需要任何技巧。

通过使用position: absolute代替flex-box，当你添加更多东西时，最终不会很好，或者稍后重新安排将是噩梦。