如何使CSS'min-height'属性无效？

Question

Here is my code:

 .one, .two { border:1px solid; min-height: 300px; } .two { overflow: auto; } 

 <div class="one">something1</div><br> <div class="two">something2</div> 

All I'm trying to do is deactivate min-height property for .two . I can do the same thing by using auto for height . Like this: .two{height:auto} . But how can I do that for min-height ?

Answer 1

According to the relevant W3.org documentation on the min-height property , the initial value is 0 .

Therefore, if you want to override the min-height property on that element and set it back to its initial value, you would use:

.two {
  min-height: 0;
}

Of course you could also use the initial value (ie, min-height: initial ), however that isn't supported across all browsers. See this relevant caniuse page for a reference on the current browser support of the initial property.

Answer 2

set min-height: initial; that would let you to min-height: 0

 .one, .two { border: 1px solid; min-height: 300px; } .two { overflow: auto; min-height: initial; } 

 <div class="one">something1</div> <br> <div class="two">something2</div>