border-spacingプロパティは border-collapseプロパティで表の枠(ボーダー)の表示モデルに分離ボーダーモデル(border-collapse : separate ;)が用いられた場合の各セルのボーダー間隔を指定するプロパティです。table要素の cellspacing属性と同様の機能です。
値は、"em", "px" などの単位識別子を伴う数値の長さで指定し、値を1つだけ指定する場合と値を2つ指定する場合の2種類の指定方法があります。値を1つだけ指定した場合は、水平・垂直の両方向の枠線の間隔に適用されます。2つ指定した場合は、「水平方向」「垂直方向」の順に枠線の間隔が適用されます。値を2つ指定する場合は、半角スペースで区切って続けて指定します。
CSS2 仕様における初期値は "0" なのですが、実際の主要視覚ブラウザの初期値は "1px" に設定されているようです。
.separate {
border-collapse : separate ;
border-spacing : 5px 10px ;
}
table,th,td {
border : 1px solid #666 ;
}
半角スペース区切りで長さを2つ指定した場合、「水平方向」「垂直方向」の順に枠線の間隔が適用されます。このサンプル(border-spacing : 5px 10px ;)では、水平方向に "5px"、垂直方向に "10px" の枠線の間隔が指定されています。なお、Windows版・Macintosh版ともに Microsoft Internet Explorer は border-spacingプロパティに対応していません。