Flexbox is not display space-between

Viewed 27

I've used flexbox before with justify-content: space-between; and it worked just fine, but I'm trying to apply it to a different class and it's just not working.

This one works:

.contenido-header {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

This one does not work:

.contenedor-anuncios {
  display: flex;
  justify-content: space-between;
  height: 100%;
}

I would really appreciate your input :)

1 Answers

Your .contenedor-anuncios should work fine, unless it's inside another flexbox. If that's the case, add one more property to it:

.contenedor-anuncios {
  display: flex;
  justify-content: space-between;
  height: 100%;
  flex-grow: 1; /* take as much horizontal space as possible */
}
Related