Html Tabelle Ende der Grenze geschnitten

Question

Ich weiß nicht, was los ist. Ich habe versucht, zusammenzubrechen, aber keinen Erfolg. Weiß jemand, was das ist und warum es passiert? Meine Tabellenstruktur wie folgt aus:

<thead> 
    <tr> 
    <th>1</th> 
    <th>2</th> 
    <th>3</th> 
    <th>6</th> 
    <th>5</th> 
    <th>6</th> 
    <th>7</th> 
    <th>8</th> 
    <th>9</th> 
    <th>10</th> 
    <th>11</th> 
    <th>12</th> 
    </tr> 
</thead> 
<tbody> 
    <td>1</td> 
    <td>2</td> 
    <td>3</td> 
    <td>4</td> 
    <td>5</td> 
    <td>6</td> 
    <td>7</td> 
    <td>8</td> 
    <td>9</td> 
    <td>10</td> 
    <td>11</td> 
    <td>12</td> 
</tbody> 

Css haben nur border-bottom: 1px solid "color code", wie dieses Bild unten:

Dies ist die fiddle ist. Werde der echte Problemlöser bitte aufstehen!

Alle Grenzen sind nicht ganz. Und Grenzen wie in diesem Bild geschnitten.

Answer 1

zwei Möglichkeiten, um den Abstand zwischen den Zellen zu entfernen:

1. Define table als:

   <table border="0" cellspacing="0" cellpadding="0">

2. hinzufügen CSS:

   table { 
       border-collapse: collapse; 
   } 
   

   OR:

   table {    
       border-spacing: 0; 
   } 
   

JSFiddle: https://jsfiddle.net/sahero/wngu28m4/1/