¿Cómo desarmar la altura máxima?

¿Cómo restablezco la max-heightpropiedad a su valor predeterminado, si se ha configurado previamente en alguna regla CSS? Esto no funciona:

pre {
  max-height: 250px;
}

pre.doNotLimitHeight {
  max-height: auto; // Doesn't work at least in Chrome
}

Restablecer a none:

pre {
  max-height: 250px;
}

pre.doNotLimitHeight {
  max-height: none;
}

Referencia

Puede borrar el atributo max-height utilizando el siguiente CSS:

max-height:none; 

Solo una nota, si está utilizando JavaScript para darle estilo al elemento, el $el.style.maxHeight = '50px';uso $el.style.maxHeight = 'none';no "restablecerá" o "eliminará" el 50px, simplemente lo anulará. Esto significa que si intenta "restablecer" la altura máxima de un elemento que lo usa $el.style.maxHeight = 'none';, aplicará el nonevalor a la max-heightpropiedad del elemento, anulando cualquier otra max-heightpropiedad válida en las reglas de selección CSS que coincidan con ese elemento.

Un ejemplo:

styles.css

.set-max-height { max-height: 50px; }

main.js

document.querySelectorAll('.set-max-height').forEach($el => {
  if($el.hasAttribute('data-hidden')){
    $el.style.maxHeight = '0px'; // Set max-height to 0px.
  } else {
    $el.style.maxHeight = 'none'; // 'Unset' max-height according to accepted answer.
});

Para realmente "desarmar" un estilo en línea, debe usar $el.style.removeProperty('max-height');.

Para completar esto para una regla de estilo completa y no solo para un solo elemento, primero debe encontrar la regla que desea modificar y luego llamar a la removePropertyfunción en esa regla:

for(let i = 0; i < document.styleSheets[0].cssRules.length; ++i){
  if(document.styleSheets[0].cssRules[i].selectorText == '.set-max-height'){
    document.styleSheets[0].cssRules[i].style.removeProperty('max-height');
    break;
  }
}

Puede encontrar los objetos StyleSheety como CssRulequiera, pero para una aplicación simple, estoy seguro de que lo anterior será suficiente.

Perdón por poner esto como respuesta, pero no tengo 50 repeticiones, así que no puedo comentar.

Salud.

Utilizar cualquiera

max-height: none;

o

max-height: 100%;

Nota : el segundo es relativo a la altura del bloque contenedor.

Puedes usar

max-height: unset;

que restablece una propiedad a su valor heredado si está heredando de su padre (funcionará como palabra clave heredar) y en caso de que no esté heredando se restablecerá a su valor inicial (funcionará como palabra clave inicial).