更改继承了高度

Question

我有一样的东西：

.parent { 
    height: 400px 
} 

.child { 
    height: inherit; 
} 

，我需要通过像素更改继承高度 - > 像这样

.child { 
    height: inherit - 10px 
} 

所以child height将390px我们案件。 问题是继承高度是一个对象。

任何方式来做到这一点？

Answer 1

虽然可以使用计算的，人长的计算之前做这样的事情：

.parent { 
 
    border: 1px solid red; 
 
    height: 100px; 
 
    width: 100px; 
 
    position: relative; 
 
} 
 

 
.child { 
 
    border: 1px solid blue; 
 
    position: absolute; 
 
    bottom: 10px; 
 
    top: 0; 
 
    left: 0; 
 
    right: 0; 
 
}

<div class="parent"> 
 
    <div class="child"></div> 
 
</div>

Answer 2

你可以用calc做到这一点：

.child { 
    height: calc(100% - 10px); 
}