Lección 7: Display

Ocultar

.elemento {
    display: none;
}

Actuales

Solo son compatibles con Firefox.

.elemento {

    /* Bloque */
    display: block flow;
    /* Línea */
    display: inline flow;
    display: inline flow-root;

    /* Capacidad de bloque pero posicionado en línea */
    display: block flow-root;

    /* Flex en bloque */
    display: block flex;
    /* Flex en linea */
    display: inline flex;

    /* Grid en bloque */
    display: block grid;
    /* Grid en línea */
    display: inline grid;
}

Heredados

Son compatibles con todos los navegadores ya que formaron parte en el pasado del estándar. Se mantienen por temas de retrocompatibilidad.

.elemento {

    /* Bloque */
    display: block;
    /* Línea */
    display: inline;
    display: inline;

    /* Capacidad de bloque pero posicionado en línea */
    display: inline-block;

    /* Flex en bloque */
    display: flex;
    /* Flex en linea */
    display: inline-flex;

    /* Grid en bloque */
    display: grid;
    /* Grid en línea */
    display: inline-grid;
}

7-1 7-2

¿Te ayudo?

  • 1 café: ¡Gracias por el apoyo! Te ayudo a que esta web siga estando online pagando los servidores.
  • 2 cafés: Respondo a una duda en los comentarios.
  • 4 cafés: Te corrijo una actividad y te envío feedback.
Comprame un café

Comentarios

{{ comments.length }} comentarios

Nuevo comentario

Nueva replica  {{ formatEllipsisAuthor(replyComment.author) }}

Acepto la política de Protección de Datos.

Escribe el primer comentario