Fieldset with `max-height: 0` always overflows on Chrome v87+

As a workaround you can add this to the fieldset:

display: -webkit-box; or display: -webkit-inline-box;

fieldset {
    /* Reset user-agent styles */
    padding: 0;
    margin: 0;
    border: 0;
    
    overflow: hidden;
    
    /* Misc */
    background: cyan;
    margin-top: 1em;
}

<fieldset style="max-height: 9px; display: -webkit-box;">
  This should be half-visible
  (<code>max-height: 9px; overflow: hidden</code>)
</fieldset>

<fieldset style="height: 9px">
  This should also be half-visible
  (<code>height: 9px; overflow: hidden</code>)
</fieldset>

Tags:

Css

Google Chrome

Fieldset

Overflow

Related