Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Los elementos del mapa de cursos no se muestran en columna

Saludos, me gustaría saber porque se muestra en fila y no en columna los elementos de la clase "rodapePrincipal-navMap-list"

Así se muestra:

Mapa de cursos

Este es el codigo Flexbox:

.headerPrincipal .container { display: flex; align-items: center; justify-content: space-between; }

.headerPrincipal-nav { display: flex; }

.rodapePrincipal-patrocinadores .container { display: flex; justify-content: space-between; }

.rodapePrincipal-patrocinadores-list { display: flex; align-items: center; justify-content: space-around; width: 70%; margin-right: 5%; }

.rodapePrincipal-contatoForm { width: 25%; }

.rodapePrincipal-contatoForm-fieldset { display: flex; }

.contenidoPrincipal-cursos { display: flex; flex-wrap: wrap; }

.contenidoPrincipal-cursos-link { display: flex; width: 23%; }

.videoSobre .container { display: flex; }

.videoSobre-sobre { text-align: center; display: flex; flex-direction: column; }

.videoSobre-video { flex-grow: 2; flex-shrink: 2; }

.videoSobre-sobre-list { flex-grow: 2; }

/* Responsive */

@media(max-width: 768px) { .headerPrincipal .container { flex-direction: column; align-items: initial; text-align: center; }

.headerPrincipal-nav {
    flex-direction: column;
}

.contenidoPrincipal-cursos {
    flex-direction: column;
}

.contenidoPrincipal-cursos-link {
    width: 100%;
}

.rodapePrincipal-navMap-list {
    height: auto;
    flex-wrap: nowrap;
}

.rodapePrincipal-patrocinadores .container {
    flex-direction: column;
}

.rodapePrincipal-contatoForm {
    width: 100%;
}

.rodapePrincipal-patrocinadores-list {
    align-items: center;
    margin: 0;
    width: 100%;
}

.rodapePrincipal-contatoForm-fieldset {
    justify-content: center;
}

.headerPrincipal-nav-link-app {
    order: -1;
}

.videoSobre .container {
    flex-direction: column;
}

}

1 respuesta

Hola Steven, espero que estés bien.

Porque en tu código no está especificado flex-direction: column;

Si tienes alguna duda, no dejes de preguntar. ¡Estamos aquí para ayudarte!.

¡Saludos!

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios