Veo que muchos confunden el uso de justify-self y justify-items y ya vi varias respuestas a eso. Pero yo tengo una duda distinta, relacio...

Angel Solis

Angel Solis

Pregunta
studenthace 4 años

Veo que muchos confunden el uso de justify-self y justify-items y ya vi varias respuestas a eso. Pero yo tengo una duda distinta, relacionado al mismo tema y que no he podido ver alguna respuesta ¿En qué caso me serviría usar justify-items? Porque en flexbox no le he encontrado uso. Acaso ¿Tiene que ver con que flexbox en unidireccional?

4 respuestas
para escribir tu comentario
    Edgar Benjamin Tzul Tacam

    Edgar Benjamin Tzul Tacam

    studenthace 3 años

    Lo que Hector Olvera Vital es muy cierto, de igual manera pienso que justify-items esta de mas porque display tiene la propiedad de flex y no grid

    Edgar Benjamin Tzul Tacam

    Edgar Benjamin Tzul Tacam

    studenthace 3 años

    Estoy de acuerdo con la aclaracion de @hyfi06, lo mismo piendo que justify-items es propiedad de grid y no de flexbox

    Hector Olvera Vital

    Hector Olvera Vital

    studenthace 4 años

    Hola!

    justify-items
    es una propiedad de Grid, no de flexbox. Para alinear en flexbox en la dirección principal usamos
    justify-content
    y para la dirección perpendicular a la dirección principal usamos
    align-items
    .

    En el caso de CSS Grid, para alinear en la dirección inline (renglón) usamos

    justify-items
    en la dirección block (columnas)
    align-items
    . Te recomiendo que cheques los ejemplos de la documentacion: https://developer.mozilla.org/en-US/docs/Web/CSS/align-items https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items

    Recuerda que según el valor de

    display
    algunas las propiedades del bloque se compartan diferente, como por ejemplo si usas
    display:inline
    ignora las propiedades de
    width
    y
    height
    . Así, si usas
    display:flex
    ignora la propiedad
    justify-items
    , por este motivo no le has encontrado uso, ya que no lo tiene.

Curso de Maquetación en CSS [Empieza Gratis]

Curso de Maquetación en CSS [Empieza Gratis]

Construye un blog personal con CSS, usando Grid y técnicas de maquetación. Aprende a organizar tu proyecto con clases específicas, incluye herramientas como Chrome DevTools para depurar, y haz que tu sitio sea responsive con media queries.

Curso de Maquetación en CSS [Empieza Gratis]
Curso de Maquetación en CSS [Empieza Gratis]

Curso de Maquetación en CSS [Empieza Gratis]

Construye un blog personal con CSS, usando Grid y técnicas de maquetación. Aprende a organizar tu proyecto con clases específicas, incluye herramientas como Chrome DevTools para depurar, y haz que tu sitio sea responsive con media queries.