Ahmad Shadeed: Casos de uso de CSS Fit-Content trucos CSS

Portada de Ahmad Shadid CSS fit-content dimensionamiento de palabras clave. ¡Es útil! simplemente no aparece súper con frecuencia. encuentro que uso min-content mucho más, como al ajustar la altura de un grid-template-row.

EN fit-content palabra clave en realidad está estrechamente relacionada con min-content y max-content – solo hay un poco de heurística, lo que significa que Ahmad ilustra bien como un diagrama de flujo.

Casos de uso de contenido apto para CSS por Ahmad Shadid

Mi caso de uso favorito se analiza aquí: dimensionar un <figure> s fit-contentpara envolver bien <img>De esta manera, incluso si la imagen no llena el espacio principal y puede permanecer en el nivel de bloque.

También cubrimos el buceo profundo de PPK. fit-content el año pasado. Una de las conclusiones clave para entenderlo es saber que se trata esencialmente de una forma de escribir estenográfica:

.box {
  width: fit-content;

  /* ... is the same as ... */
  width: auto;
  min-width: min-content;
  max-width: max-content;
}

Conexión directa →

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

rtp live