Safari(iOS) で 100vh が正しいサイズを返さない問題の対処法

iOS の Safari は ViewPort の相対単位(vh/vh/vmin/vmax)には他のブラウザと異なる挙動があり、100vh を指定するとアドレスバーの高さを含んだサイズを返してしまう問題があります。

以下のJavaScriptを導入することにより解決ができます。
https://github.com/rodneyrehm/viewport-units-buggyfill

npm i viewport-units-buggyfill --save
import * as viewportUnitsBuggyfill from 'viewport-units-buggyfill';

viewportUnitsBuggyfill.init();
window.addEventListener('resize', viewportUnitsBuggyfill.refresh, true);

AWS構築サービスの全てをまとめた資料を公開中

ハックノート(TOWN株式会社)では、AWSの導入や構築支援を行っています。AWS導入メニューやサービス詳細、構成例や費用を掲載した資料をダウンロードできます。

AWSの新規導入やAWSへの移行を検討の際は、ぜひご参考ください。


APNコンサルティングパートナー

TOWN株式会社はAmazon公認コンサルティングパートナーです。