最後のナビゲーション項目を右へ

今まではロゴとナビゲーションを、小さい時は中央揃えで2段、中くらいでは左右に分割、広い画面の時は左寄せ気味にしてた。広い画面の時に右の空き方が気になっていたので、なんか飾りでも入れようかと思って、色々試してたけどダメそうなので、単純に最後の項目(About)を右寄せにすることにした。

[role="banner"] {
  position: relative;
}

[role="banner"] nav li:last-child {
  potion: absolute;
  top: 0;
  right: 0;
}

として、多少位置調整しただけ。

見た目のバランス的には良いけど、広い画面以外とAbout項目の扱いが変化してしまうのはあまり良くない。メガメニューとかでよくありがちな、こういう無理やりなんとか収める的な考え方で振るまいを変更すると、小さい画面の時と大きい画面の時で同じレベルの項目にたどり着く手順に差が出てきやすい。手順の差はそのままアクセス性の差になり、コンテンツ発見に大きな影響を与えてしまう。

うまい方法を考えてるけど思いつかない。