可変幅で両側にドロップシャドウ（div一重で）

てんぽ: 可変幅で両側にドロップシャドウ（div一重で） CSSやHTML、FC2ブログのカスタマイズ、共有テンプレートなど background-positionを%単位で指定し、ドロップシャドウ用の画像の大きさを調整することで、 画面の両側に影をつけたリキッドデザイン（画像の使用を極力控えてかっこいいCSSデザインをやってみよう大会のような）を実現できます。 しかも必要となるdivはひとつだけです。 このようなデザインでは divを二重にして一方のdivの左端に左側用の影画像を、もう一方のdivの右端に右側用の影画像を背景画像として指定するのが簡単です。 <div id="left"> <div id="right"> </div> </div> #left { width: 90%; margin: auto; background: url(shadow-left.gif) top

[as365n2]

body要素とbackground-position

[jamg]

おぉ。以前にメモランダムの石川さんがやっていたのと同じかな？

[asiamoth]

bodyとdivにCSSを適用させる。なるほどー。

[irohiroki]

親要素のbackground-positionを使う

[lucky-bag]

なるほど。