Cocoonでヘッダーモバイルボタンを、画面を横向き(landscape)に対処させる

CSSあんま詳しくないけど、手探りで試してみた。
なんとなく上手く行ったので、メモがてら記事にしてみよう。

/* Cocoonでヘッダーモバイルボタンが
画面を横向き(landscape)にすると
iphoneのノッチのせいで隠れちゃう問題の対処*/
.mobile-menu-buttons{
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
}

/*モバイルボタンメニュー閉じるボタンの位置*/
.menu-close-button{
	text-align:right;
	/*padding-right:10px;　コメントアウト*/
	
	/*以下を追記 */
	padding-right: calc(env(safe-area-inset-right) + 0.5em);
}

これをstyle.cssに追記した。

iphone12miniとipadminiでしか検証してないが…