選択できません<TR>

Question

<tr>コンテンツのプロパティを変更するには、CSSを使用したいと思います。しかし、以下のコードは<tr>で動作しませんが、<td>で動作します。何かがうまくいきましたか？

CSS：

#leaderboard tr { 
border: 1px red solid; 
} 

.leaderboard { 
border: 1px red solid; 
} 

HTML：のみ、個々の細胞が（IEで）国境を持っているので、あなたがTRの境界特性を与えることができない私見

<table id="leaderboard"> 
    <tr class="leaderboard"><td>Hello</td></tr> 
    <tr class="leaderboard"><td>There!</td></tr> 
</table> 

Answer 1

。 したがって、最も簡単な解決策は、テーブルの左右の境界線とセルの上下の境界線を与えることです。

#leaderboard { 
    border: 1px red solid; 
} 

#leaderboard td { 
    border-top: 1px red solid; 
    border-bottom: 1px red solid; 
} 

Answer 2

Works fine（ChromeとFirefox）現代の標準に準拠したブラウザを使用していますか？

Answer 3

私の理解しているように、TRは他の要素のようにレイアウトスペースを占有しません。

<div id='leaderboard'> 
    <div class='leaderboard'>Hello</div> 
    <div class='leaderboard'>There</div> 
</div> 

あなたがdiv秒で行うことはできませんテーブルでできることは何もありません、しかし：あなたはよくそうのように、ネストされた、分類のDIVを使用して、テーブル/ TR/TD構造を取引することをお勧めすることだろう逆に多くがありますdivはできません。tableはできません。

Answer 4

IE8、FF5で動作します。

<style type="text/css"> 
.td{ 
    border:1px solid red; 
    border-top:0; 
    height:28px; 
    } 
</style> 

<table width="300px" style="border-top:1px solid red;border-right:1px solid red;" cellpadding="0" cellspacing="0"> 
    <tr> 
     <td class="td" style="width:50px;">head1</td>       
     <td class="td" style="width:50px;">head2</td> 
    </tr>   
    <tr> 
     <td class="td">cell1</td>        
     <td class="td">cell2</td> 
    </tr> 
</table>