¿Cómo mover un elemento de enlace específico a la derecha del encabezado?

Gran TC, una pregunta rápida sobre cómo mover la sección .links hacia la derecha con CSS. He estado intentando mover un solo enlace de .nav .nav-pills hacia la derecha pero no he podido lograrlo. Puedo mover todo .contents usando justify-content: right, pero esto no funciona para la sección .links, y no entiendo la interacción entre Flexbox y las partes del encabezado que no son Flexbox.

No tengo nada en la sección de Iconos, pero intenté configurar un icono para aprender por qué están a la derecha, sin embargo, todavía se me escapa.

¿Alguien tiene un fragmento CSS simple que mueva los Enlaces hacia la derecha?

1 me gusta

Hola Marcus,
Si entiendo bien, este SCSS debería hacer lo que quieres:

.b-header nav.links {
    .nav-pills, & {
        display: flex;
        flex: 1;
        li:last-child {
            margin-left: auto;
        }
    }
}

3 Me gusta

¡Funciona perfectamente, gracias @Canapin!
Intenté padding-left: auto en el elemento necesario, ¡pero no margin-left: auto! Mi habilidad con CSS no es muy fuerte.

2 Me gusta

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.