CSS高度：盡管父div具有高度，但100％不能在行內塊元素上使用

Question

我有一個div，其中有兩個子div，如下所示：

<div id="cartgrid" style="display:inline-block">
    <div class="cart-left">
        ....
    </div>
    <div class="cart-right">
        ....
    </div>
</div>

.cart-left擁有一個項目表，而.cart-right只有幾個按鈕，因此.cart-left總是比.cart-right ； 父div的高度由.cart-left的高度確定。 我希望.cart-right與.cart-left具有相同的高度，所以我給它設置了height:100% ，但是即使它的父母（ #cartgrid ）具有高度值， height:100%也不執行任何操作。

小提琴： https : //jsfiddle.net/zjuzh07n/

Answer 1

有點臟，但這就是我要解決的方法。

#cartgrid {
  position: relative;
  display: inline-block;
}
  .cart-right {
    position: absolute;
    display: inline-block;
    right: 0;
    height: 100%;
  }

希望它會有所幫助。