HTMLテーブルの構造に分周器を追加する

Question

I持ってMSIE8で以下のセットアップ：私は何を後にしていますが姓の間に斜めのライン/破線または単にラインのように配置する手段が

<table class="my-info"> 
    <tbody> 
     <tr> 
      <td class="info-left">First name:</td> 
      <td class="info-highlight">FirstName</td> 
     </tr> 
     <tr> 
      <td class="info-left">Surname:</td> 
      <td class="info-highlight">Surname</td> 
     </tr> 
     <tr> 
      <td class="info-left">Email:</td> 
      <td class="info-highlight">TheEmail</td> 
     </tr> 
    </tbody> 
</table> 

で、 Eメール。

私は<hr />を試しましたが、スペーシングの上下が大きすぎます。

誰かがこれを手助けすることができます。それもきれいに見えるようにコンパクト。

ありがとうございました。たぶん

Answer 1

。もちろん、私は国境崩壊の大きなファンです。

/CSS/

.my-info {border-collapse: collapse;} 
.bottom-border { border-bottom: 1px dashed black; } 

/HTML/

<table class="my-info"> 
    <tbody> 
    <tr> 
     <td class="info-left">First name:</td> 
     <td class="info-highlight">FirstName</td> 
    </tr> 
    <tr> 
     <td class="info-left bottom-border">Surname:</td> 
     <td class="info-highlight bottom-border">Surname</td> 
    </tr> 
    <tr> 
     <td class="info-left">Email:</td> 
     <td class="info-highlight">TheEmail</td> 
    </tr> 
    </tbody> 
</table> 

/JSFiddle/ http://jsfiddle.net/wHmyx/

Answer 2

：私はおそらくこのような何かをしたい

<tr> 
     <td class="info-left">Surname:</td> 
     <td class="info-highlight">Surname</td> 
    </tr> 
    <tr> 
     <td colspan="2" class="divider"><hr /></td> 
    </tr> 
    <tr> 
     <td class="info-left">Email:</td> 
     <td class="info-highlight">TheEmail</td> 
    </tr> 

Answer 3

こんにちは、あなたはCSSのn番目の子で簡単にこれを行うことができますセレクタはcssとhtを参照してくださいml以下： - ：http://jsfiddle.net/TfK6Z/1/