colgroupでアウトラインボーダーを取得する方法は？

Question

私は17列のテーブルを3つの列グループに分けています。 CSSを使用して背景色を設定することができます。これは、CSSセレクタが問題ないことを示しています。私は、しかし、各colgroupの外側の周りに境界線を設定することはできません。

まず私はこのCSSを試してみました：

colgroup.inbound, colgroup.outbound { 
    background-color: #eeeeee; 
    border: 1px solid red; 
} 

と定義された列グループをこのように：

<colgroup span="2"></colgroup> 
<colgroup span="12" class="inbound"></colgroup> 
<colgroup span="3" class="outbound"></colgroup>  

次の私は、このCSSみました：

col.inbound, col.outbound { 
    background-color: #eeeeee; 
    border: 1px solid red; 
} 

をとグループをこのように定義されました：

<colgroup 
    <col span="2"> 
    <col span="12" class="inbound"> 
    <col span="3" class="outbound">    
</colgroup> 

私の背景色は有効ですが、私の境界線は有効ではありません。私が見ることができる唯一の境界線は、すべてのセル間の細い白い線です（グループ全体ではありません）。

私は表rules属性を認識していますが、これを使用しないことをお勧めします。私はそれを使用する方法を考え出すことができれば、CSSは私により柔軟性を与えるだろうと思う！

ありがとうございます！あなたはあなたがふりとして、あなたの境界線を取得するテーブル

table.collapsed{ 
    border-collapse:collapse; 
} 

ザ・に次のルールを設定する必要があり、テーブルを使用するときに作業ボーダーを作るために

Answer 1

col.inbound, col.outbound { 
    background-color: #eeeeee; 
    border: 1px solid red; 
} 

この中の簡単な例JsBin

オプション グループ全体の代わりに、あなたの代わりにようにCOLSのCOLGROUPを支配すべき

その後

各列の境界線...

colgroup.inbound { 
    border: 1px solid #ff0000; 
} 

オールウェイズ覚えています国境崩壊を使う！ これはこちらでご覧になれますJsBin