キービジュアルのところとか、デザインによっては、要素を絶対配置してアニメーションしたい時とか。デスクトップのデザインとモバイルのデザインはあるけれど、タブレットのデザインがない時とか。デスクトップのレイアウトのまま、タブレットサイズに収めたい時とか。そんな時に応急措置として使えるレシピ。 要素を絶対配置したいときとは 一枚絵だけれど、イラストひとつひとつを順番に表示させたい、というようなとき。 単純にピクセル値で絶対配置しちゃうと、下サンプルみたく、横幅の狭いタブレット端末などで、横スクロールバーが出ちゃうし、背景途切れちゃうし、格好悪いですね:(。 画面サイズに合わせて伸縮したい 例えば、「ウィンドウの横幅が1200px以下の時にはウィンドウ幅いっぱいのまま伸縮させたい」ような場合、ウィンドウ幅が1200px以下の時の要素の幅をvwで表すと「100vw(=横幅いっぱい)」になります。 と
![絶対配置をレスポンシブしたいとき。](https://cdn-ak-scissors.b.st-hatena.com/image/square/de7e5403171d0bc0964d907e994fadc23441355d/height=288;version=1;width=512/https%3A%2F%2Flopan.jp%2Fabsonsive%2Fogp.png)