IE6~8でCSS3を利用可能にするライブラリ「Selectivizr.js」使い方と注意点

ノートパソコンで作業中
CSS3は便利ですが、IE6~8ではほとんど対応していないのが困りモノ。IE9以上でそれなりに使えるようになるレベルです。 IE6はもう切っていいと思いますが、IE8はまだ現役で使っている方もいるはずなので、できれば対応したいですよね。 そんなIE6~8でCSS3を利用できるようにしてくれるjsライブラリ「
続きを読む

【CSS】floatさせた画像の下にテキストを回り込ませない方法(サンプルコードあり)

コードが書かれたモニター
floatを使ってテキストと画像を配置することはコーディングでよく使う記述だと思います。 ただ、普通にfloatしただけだとテキストが画像よりも長くなった場合、下に回りこんでしまいます。デザインによっては回り込まないで端を揃えたいこともあります。今回はfloatさせた画像下に文字を回り込ませない方法を紹介し
続きを読む

【CSS】ブログのサイドバーのテキストにカテゴリーアイコンを表示する方法

アイコンのイメージ
少し前にブログのサイドバーにカテゴリーアイコンを付けました。 最初、カテゴリやページのリンクにアイコンを付けられるWordPressプラグイン「Category and Page Icons」をインストールしましたが、当ブログの環境では上手く動作しませんでした。パーミッションをいじったり、直接画像をアップロ
続きを読む

CSSを綺麗に整形してくれるオンラインツールのまとめ

コードが書かれたモニター
CSSの記述の仕方は人によってクセがあります。個人ブログなら、自分だけわかるように書けば問題ありませんが、社内のプロジェクトなど複数の人間が管理する場合、ある程度見やすく共通化されていないといけません。 そんな時に役立つのが、CSSを整形してくれるオンラインサービス。今回は、私がよく使う整形ツールを3つ紹介
続きを読む

【CSS】floatを使ったら画像が表示されなくなる場合の解決方法

コードが書かれたモニター
CSSのfloatを使うと画像が消えてしまう場合の解決方法について。 私の環境だと、ローカルでは問題なく表示されるのにサーバーにアップすると画像が消える現象が起きたので共有します。 floatを使うと画像が消える時の解決方法 確認するポイントは次の2点。 画像にwidthを指定してみる clearでfl
続きを読む

【ブラウザ】よく使うCSSハックのまとめ(IE6~9・Firefox・Chrome)

本を読んでいる女性
HTMLのコーディング時に使う代表的なCSSハックを紹介します。 もちろん、CSSハックはなるべく使わないようにマークアップすることが大前提です。どうしても表示がきちんとされない時の最終手段と覚えておくといいと思います。 CSSハックとは Webサイト作成の際にWebブラウザ間(以下単に「ブラウザ」)で異
続きを読む