CSS : メディアクエリを使わずレスポンシブ幅に対応する

メディアクエリの記述を使わず、最もコンパクトにレスポンシブな幅指定する方法。

.hoge {
  width: 90vw; //スマホ時の幅
  max-width: 800px; //PC表示時の幅
}

 width: 90vwは画面幅の90%の幅になりますが、max-width: 800pxで最大幅を制限しているため、800pxを境にフレキシブルに幅が可変します。

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

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

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


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

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