CSS3のbox-shadowで画像がめくれた様な影を！
Date：2013/09/16 | 
Category：
↑上記↑のような画像がめくれているような影、良く見かけると思います。
さて、今日はこのようなエフェクトを作る、CSS3のbox-shadowプロパティを紹介します。
IE・Safariでのレイアウト崩れや表示違い対策 CSSハックのまとめ
※2013年6月9日記事作成。2014年6月3日加筆修正。
サイトの制作や更新を行っていると、どうしてもブラウザ間で表示が異なる事象が出てしまいます。
言わずもがなIEの古いバージョンのレイアウト崩れは多いです。
そしてSafariも、表示フォントが変わってしまったりする場合があります。
で、通常の対策を行っても、ブラウザ間の表示違いを修正できないときに役立つのがCSSハックというテクニックです。
ちなみにCSSハックとは、各ブラウザの実装状況やバグを逆手に取り、ブラウザによって異なる宣言を読み込ませるための記述。
別の言い方をすると「IE6だけに読ませるスタイル」とか「safari2〜3.1のみに読み込ませるスタイル」を指定する記述です。
CSS3 テキストシャドウのかっこいいサンプル10選
tableレイアウトが崩れた原因は、CSSリセットかもしれない。
さて、先日クライアントから「サイトに貼りつけたバナーのレイアウトが崩れてしまう」という、ご相談をいただきました。
そのバナーのHTMLソースを見てみると、tableタグで組まれたものでした。
最初「どこかの閉じタグでも忘れているのかな？」と思ったのですが、別に記述ミスはありません。また、変なfloatなども かかってはいないようです。
そこで検証した結果、スタイルシートに記述されたCSSリセットの一部に原因がありました。
