Headerを中央、右ぞろえにする方法

Headerの中央にタイトル、右端に各機能など配置したいときありますよね。
ちょうどこんな感じです。(個人製作アプリですみません。。。)

私は、基本flexboxを使用しているのですが、flexboxの機能だけではできない、実装です。

そういった場合、relativeとabsoluteを使うとうまく実装できます。

  <div className="relative flex justify-center">
    <h1>中央のタイトル</h1>
     <div className=" absolute right-0 ">
      <div className="flex">
         <div>Japan</div>
         <div>USA</div>
        <div>China</div>
      </div>
    </div>
  </div>

是非お試しあれ。