CSS Archive

Internet Explorer は width 指定があると、垂直マージンが相殺できないみたい。

Continue reading

HTML の一番上に h1 要素を書いて、CSS で、

body { line-height: 150%; }

と言った記述をすると、Windows Internet Explorer 7 で見出しの文字が欠けてしまいます。

こんな感じ。

Continue reading

CSS を複数ファイルに分割して管理する時のファイル名を考え中。みんな、どんなファイル名を使ってるんだろう？調べてみたい。

Continue reading

CSS を書いている時、id, class 名を決めるとき悩む事が多いので、忘れっぽい自分の為に覚え書き。

Continue reading

さっき書いたエントリー の応用で、デフォルトフォントサイズを 10 ピクセルにし、

font-size:10px → font-size:100% or font-size:1.0em
font-size:12px → font-size:120% or font-size:1.2em
font-size:14px → font-size:140% or font-size:1.4em
font-size:16px → font-size:160% or font-size:1.6em
font-size:18px → font-size:180% or font-size:1.8em

と指定できると簡単かなぁと思い、サンプルを作ってみました。

Continue reading

本文を 12 ピクセル相当の大きさで表示すべく、font-size:75%; で指定されたページを Mac Firefox 2.0 で見ると文字が小さく見えます。

これは、Mac Firefox 2.0 のデフォルトフォントサイズが 14 ピクセルの為で、計算してみると 10.5 ピクセル相当の大きさでレンダリングされている事になります。

14px * 75% = 10.5px

確かに小さいですねー。

Continue reading

キャプション付き画像に本文を回り込ませる CSS のサンプルを書いてみた。

• キャプション付き画像の回り込み

こんな書き方で正解なんだろうか？

CSS ハックと言うものを使うと、特定のブラウザだけにスタイルを適用したり、バグを回避したりできるみたいなので、その方法をメモ。

Continue reading

CSS の position プロパティを使ったレイアウトをお勉強中です。

この方法の利点は、HTML の出現順に左右されないレイアウトができる所です。例えば、HTML の末尾に書いた内容をページの一番上に配置することができます。

以下、簡単にまとめてみました。間違ってたらゴメンナサイ。

プロパティのキーワードについて

最後にソースの書き方によって、基点がどう変わるかの サンプル です。

CSS でテキストを回り込ませるサンプルを作ってみました。

• 見出し行で回り込みを解除するサンプル
• ブロック毎に回り込みを解除するサンプル

こんな書き方で良いのかなぁ。

Mac Internet Explorer 5.2, Mac Firefox 2.0, Mac Safari 2.0 で表示確認。