2017-04-21 19 views
1

なんらかの理由でテーブルが必要です。親テーブルには境界線があり、最後には<tr>があります。子テーブルには境界線がありません。しかし、私はそれらをCSSで削除することはできません。私はSO上で見つけることができるいくつかのソリューションを試してみましたが、誰も私のために働いた。 @skobaljicによって示唆されるように別のテーブルのテーブルから境界線を削除する

.table_wrapzm { 
 
    border-collapse: collapse; 
 
    font-family: Arial, Helvetica; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
    text-align: center; 
 
} 
 

 
.table_wrapzm tr { 
 
    border-bottom: 1px solid #ddd; 
 
} 
 

 
.table_wrapzm .h3 { 
 
    font-size: large; 
 
    font-weight: bold; 
 
    text-align: center; 
 
} 
 

 
.table_wrapzm .bron { 
 
    font-size: small; 
 
    text-align: left; 
 
    color: #ddd; 
 
} 
 

 
.table_wrapzm a:link { 
 
    color: #ddd; 
 
} 
 

 
.table_wrapzm a:visited { 
 
    color: #ddd; 
 
} 
 

 
.table_wrapzm a:hover { 
 
    color: black; 
 
} 
 

 
.table_wrapzm a:active { 
 
    color: #ddd; 
 
} 
 

 
.table_wrapzm td { 
 
    padding-bottom: 3px; 
 
} 
 

 
.table_wrapzm tr:last-child { 
 
    border-bottom: none; 
 
} 
 

 
.table_wrapzm .main { 
 
    padding: 10px 0 10px 0; 
 
} 
 

 

 
/* tabel inside table */ 
 

 
.table_zm { 
 
    border: none !important; 
 
    background: black; 
 
    color: white; 
 
    font-family: Arial, Helvetica; 
 
    text-align: center; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
} 
 

 
.table_zm .h3 { 
 
    font-size: large; 
 
    font-weight: bold; 
 
} 
 

 
.table_zm td { 
 
    padding: 3px; 
 
}
<table class="table_wrapzm"> 
 
    <tr> 
 
    <td class="h3">Title</td> 
 
    </tr> 
 
    <tr> 
 
    <td class="main"> 
 
     <table class="table_zm"> 
 
     <tr> 
 
      <td>Row 1 col 1</td> 
 
      <td>Row 1 col 2</td> 
 
      <td>row 1 col 3</td> 
 
      <td>Row 1 col 4</td> 
 
      <td>row 1 col 5</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Row 2 col 1</td> 
 
      <td>&nbsp;</td> 
 
      <td>row 2 col 3</td> 
 
      <td>&nbsp;</td> 
 
      <td>row 2 col 5</td> 
 
     </tr> 
 
     <tr> 
 
      <td>row 3 col 1</td> 
 
      <td colspan="3">&nbsp;</td> 
 
      <td>Row 3 col 5</td> 
 
     </tr> 
 
     </table> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> source</td> 
 
    </tr> 
 
</table>

+2

表のセルに境界スタイルを定義するには、 '.table_zm td {border:0 none; } '。 – skobaljic

+0

https://codepen.io/pjabbott/pen/wdWMBB –

+0

@skobaljicを削除しようとしているものを正確に視覚化するのに問題があります。私はそれを試したと思うが、それはキャッシュにまだ残っているので、リフレッシュ後にあなたのソリューションは動作します! –

答えて

0
.table_zm td { border: 0 none; } 

... CSSの残りは唯一の境界は永続的です、全体でくる不思議なことは、仕事をしてくれました。どうもありがとう!

関連する問題