Come spostare un collegamento specifico a destra dell'intestazione?

Sviluppatore
,
1

Ottimo TC, una domanda veloce sul spostamento della sezione .links verso destra con CSS. Ho provato a spostare un singolo link da .nav .nav-pills verso destra ma non sono riuscito a ottenerlo. Posso spostare l’intero .contents usando justify-content: right ma questo non funziona per la sezione .links, e non riesco a capire l’interazione tra Flexbox e le parti non-Flexbox dell’header.

Non ho nulla nella sezione Icone, ma ho provato a configurare un’icona per imparare perché sono a destra, tuttavia in qualche modo mi sfugge ancora.

Qualcuno ha uno snippet CSS semplice che sposterebbe i Link a destra?

1 Mi Piace
2

Ciao Marcus,
Se ho capito bene, questo SCSS dovrebbe fare quello che vuoi:

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

image
image1362×126 9.61 KB

3 Mi Piace
3

Funziona perfettamente grazie @Canapin!
Avevo provato padding-left: auto sull’elemento richiesto, ma non margin-left: auto! Il mio CSS-fu non è forte.

2 Mi Piace
4

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