【PCフレンドリー・デモ】 (モバイル・フレンドリーは考慮していません)。
下記の文章にも意味があるのでチャント読んで下さい。
このページはモバイルに対応して無いので、とりあえずChromeモバイル・エミュレーターで約「1000px~3000px」解像度ぐらいをチェックしてみると良いでしょう。
このページのコードを参照したい場合は、必ずブラウザの開発者ツール(デベロッパー・ツール)で参照して下さい(ダウンロードするとブラウザ?によってコードが改変されてしまう場合があるようなので)。
このページのコードは非常に単純なので理解しやすいでしょう。
これは あくまでもデモなので縦スクロール・バーの幅を引いたりなどは していません。
【注意点】
このページの「要素サイズ、font-size、margin、border、column-gap」など、全てのサイズをvw単位で指定しています。
bodyのデフォルトmarginは0.5vwに変更しています。
bodyタグで「font-size: 1.5vw;」を指定、 font-sizeをvwで指定しているので、ブラウザによる変更を許容しません。
「.Border」の幅は0.05vwに設定しています。
「.Box」のcolumn-gapは1vwに設定しています。
このページの要素には縦サイズは指定していませんが、当然 プロは縦サイズも指定します。