Firefox 1.5 から text-align:justify が適応されるようになった！
ブラウザによってフォントサイズが違う場合などはアンダースコア・ハックが有効です。CSS で設定したプロパティ（width/font-color 等）の前にアンダースコア "_" を付与すると Win IE ではそれを正常なプロパティとして読み込み、他のブラウザでは無視される（定義されていないプロパティとして認識される）ことを利用したものです。例えば、
div {
font-size:10px;
_font-size:9px; ← Win IE ではフォントサイズが9ピクセルになる
}
<table width="300">
<tr>
<td>かおりんちょ</td>
<td>エジプトのプトレマイオス王朝最後の女王。正式には「かおりんちょ7世」。美貌と教養・機知を併せ持ち、ローマの有力者を手玉に取ったとして古代随一の有名な女性。</td>
</tr>
<tr>
<td>かめ</td>
<td>中国唐代の皇妃。玄宗皇帝の寵姫。蜀出身。あまりにも玄宗皇帝が寵愛しすぎたために安史の乱を引き起こしたので傾国の美女と呼ばれる。</td>
</tr>
<tr>
<td>やま</td>
<td>安土桃山時代に活躍した盗賊である。出生地は伊賀国・河内国・丹後国・遠江国（現・浜松市）などの諸説がある。あまりの悪逆非道ぶりのために三条河原で釜煎の刑に処せられたとされている。</td>
</tr>
</table>
たとえばこういうテーブルがあったとします。これを表示するとこうなります。
| かおりんちょ | エジプトのプトレマイオス王朝最後の女王。正式には「かおりんちょ7世」。美貌と教養・機知を併せ持ち、ローマの有力者を手玉に取ったとして古代随一の有名な女性。 |
| かめ | 中国唐代の皇妃。玄宗皇帝の寵姫。蜀出身。あまりにも玄宗皇帝が寵愛しすぎたために安史の乱を引き起こしたので傾国の美女と呼ばれる。 |
| やま | 安土桃山時代に活躍した盗賊である。出生地は伊賀国・河内国・丹後国・遠江国（現・浜松市）などの諸説がある。あまりの悪逆非道ぶりのために三条河原で釜煎の刑に処せられたとされている。 |
テーブルの幅だけ決定していて（300ピクセル）項目と内容は成り行きでいいのだけれど、長いタイトル項目でも折り返さないで表示したい時どうしてますか？ タイトル項目のセルの幅を設定すればいいですよね。「かおりんちょ」はフォントサイズを10ピクセルに設定してるので6文字だから、マージンとかはこの際無視したとして td width="70" くらいにしておけばまあ安全だと思います。
<table width="300">
<tr>
<td width="70">かおりんちょ</td>
<td>エジプトのプトレマイオス王朝最後の女王。正式には「かおりんちょ7世」。美貌と教養・機知を併せ持ち、ローマの有力者を手玉に取ったとして古代随一の有名な女性。</td>
</tr>
<tr>
<td>かめ</td>
<td>中国唐代の皇妃。玄宗皇帝の寵姫。蜀出身。あまりにも玄宗皇帝が寵愛しすぎたために安史の乱を引き起こしたので傾国の美女と呼ばれる。</td>
</tr>
<tr>
<td>やま</td>
<td>安土桃山時代に活躍した盗賊である。出生地は伊賀国・河内国・丹後国・遠江国（現・浜松市）などの諸説がある。あまりの悪逆非道ぶりのために三条河原で釜煎の刑に処せられたとされている。</td>
</tr>
</table>
| かおりんちょ | エジプトのプトレマイオス王朝最後の女王。正式には「かおりんちょ7世」。美貌と教養・機知を併せ持ち、ローマの有力者を手玉に取ったとして古代随一の有名な女性。 |
| かめ | 中国唐代の皇妃。玄宗皇帝の寵姫。蜀出身。あまりにも玄宗皇帝が寵愛しすぎたために安史の乱を引き起こしたので傾国の美女と呼ばれる。 |
| やま | 安土桃山時代に活躍した盗賊である。出生地は伊賀国・河内国・丹後国・遠江国（現・浜松市）などの諸説がある。あまりの悪逆非道ぶりのために三条河原で釜煎の刑に処せられたとされている。 |
ところが、ブラウザによってフォントサイズが違ったり、ブラウザのフォント表示を大きくしている場合は「かおりんちょ」の文字列の長さがピクセルで設定したセル幅を超えるとやっぱり折り返されてしまいますから、セル幅をピクセルで設定するのがまずい場合がありますよね。
こんな時は「かおりんちょ」のセルにスタイルとして white-space: nowrap を入れるとバッチリでっす！（泣） もちろんタグに直接スタイル属性を設定しなくても OK です。
<table width="300">
<tr>
<td style="white-space: nowrap">かおりんちょ</td>
<td>エジプトのプトレマイオス王朝最後の女王。正式には「かおりんちょ7世」。美貌と教養・機知を併せ持ち、ローマの有力者を手玉に取ったとして古代随一の有名な女性。</td>
</tr>
<tr>
<td>かめ</td>
<td>中国唐代の皇妃。玄宗皇帝の寵姫。蜀出身。あまりにも玄宗皇帝が寵愛しすぎたために安史の乱を引き起こしたので傾国の美女と呼ばれる。</td>
</tr>
<tr>
<td>やま</td>
<td>安土桃山時代に活躍した盗賊である。出生地は伊賀国・河内国・丹後国・遠江国（現・浜松市）などの諸説がある。あまりの悪逆非道ぶりのために三条河原で釜煎の刑に処せられたとされている。</td>
</tr>
</table>
| かおりんちょ | エジプトのプトレマイオス王朝最後の女王。正式には「かおりんちょ7世」。美貌と教養・機知を併せ持ち、ローマの有力者を手玉に取ったとして古代随一の有名な女性。 |
| かめ | 中国唐代の皇妃。玄宗皇帝の寵姫。蜀出身。あまりにも玄宗皇帝が寵愛しすぎたために安史の乱を引き起こしたので傾国の美女と呼ばれる。 |
| やま | 安土桃山時代に活躍した盗賊である。出生地は伊賀国・河内国・丹後国・遠江国（現・浜松市）などの諸説がある。あまりの悪逆非道ぶりのために三条河原で釜煎の刑に処せられたとされている。 |
試しにブラウザのフォントサイズを大きくして見比べてみてください！
<style type="text/css">※システム識別子があるとダメ（互換モードのみ）
<!--
body {
scrollbar-track-color: #ffefff;
scrollbar-face-color: #ffccff;
scrollbar-shadow-color: #ffccff;
scrollbar-darkshadow-color: #ff66ff;
scrollbar-highlight-color: #ffccff;
scrollbar-3dlight-color: #ffffff;
scrollbar-arrow-color: #ffccff;
font-size:13px; color:black; backfround-color:#ffefff;
}
-->
</style>
外側のボックスのサイズ指定がないと起こるバグ。
ごく小さな height の指定を WinIE だけが読むように指定するとよい。
/* Hides from IE-mac \*/← MacIE は \ （バックスラッシュ）のせいでコメントの終了に気づかない
* html .○○○ { height: 1%; }← WinIE 、MacIE だけが、HTML 要素に祖先要素が存在していると解釈されるみたいだ
/* End hide from IE-mac */
letter-spacing に、Mac IE は未対応。
回避するには、letter-spacing をやめる。
不具合の発生する要素に、width か height を指定する。
（右カラムの div に width か height どちらかを指定すると回避）
body { overflow: hidden; }
ブラウザがデフォルトで持っているマージンを消すために、
margin: 0px の指定をするが、Opera はこれだけではダメ。
body { margin: 0px ; padding: 0px; }
Osaka や 細明朝体 のフォント指定時の注意。
9 , 10 , 12 , 14 , 18 , 24 , （36）px の 7 種類
上記以外は OS9 以下で字形が崩れる （ビットマップフォントがない）
media の複数記述 未対応
＠import 未対応
media="screen, not Netscape"
このように記述して、NS4 をはじいていることが分かるようにする人もいるようだ。
NS 4 は、screen 以外の値があると無視する。（media 属性の複数表記に未対応なため）
import.css を作る
@import url( special.css )
media 属性を入れると、無関係なデバイスが不要なスタイルシートを読み込むロスがない。
<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" type="text/css" href="css/special.css" media="screen,tv,print">
@import url( common.css ) ;
@import url( special.css ) screen, tv, print ;
もしくは
@import " common.css ";
@import " special.css " screen, tv, print ;
次のような記述方法もあり
@media screen { /* 画面出力用 */
body { font-size: 14px ; }
}
@media print { /* 印刷用 */
body { font-size: 12px ; }
}
@media screen, print { /* 両方に適用 */
body { line-height: 1.5 ; }
}
デフォルトのリンクカラーと違う色を部分的に使用したい時は、クラス名、もしくは ID名を付けて範囲指定する。
テーブル内のリンクカラーを変更する。
<a>タグを<div>タグなどで囲って指定する方法。
<td>タグにボーダーの設定をすると、セルの重なり部分のボーダーが太ってしまう。
td { border: 1px solid #990000; }
回避するには、 border-collapse を指定する。
border-collapse とは、テーブルにおけるセルのボーダー表示形式を指定するためのプロパティです。値には collapse と separate があり、collapse はテーブル全体や各セルのボーダーを重ねて表示し、separate は別々に表示します。
td { border: 1px solid #990000; }
table { border-collapse: collapse; }
※クラス名で指定した方が使用しやすい。
.table-collapse {
border-collapse:collapse;
}
※ただしレイヤー、インラインフレームに使用すると不具合が発生することがある。