ヘッダーの右に特定のリンク項目を移動するには？

開発
,
1

Great TC、.links セクションを CSS で右に移動させることについて簡単な質問があります。.nav .nav-pills の単一のリンクを右に移動させようとしましたが、うまくいきませんでした。justify-content: right を使用して .contents 全体を移動させることはできますが、これは .links セクションでは機能せず、ヘッダーの Flexbox 部分と非 Flexbox 部分の相互作用を理解できませんでした。

アイコンセクションには何もありませんが、アイコンが右側にある理由を学ぶためにアイコンを設定しようとしましたが、それでも理解できませんでした。

リンクを右に移動させる簡単な CSS スニペットはありますか？

「いいね！」 1
2

こんにちは、マーカスさん。
もし私の理解が正しければ、このSCSSでご希望の動作が実現できるはずです。

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

image
image1362×126 9.61 KB

「いいね！」 3
3

完璧に動作しました、@Canapin さん！
必要な要素に padding-left: auto を試しましたが、margin-left: auto は試していませんでした！私のCSS力は強くありません。

「いいね！」 2
4

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