How to make a background for one row of a table?

Question

css

How to make a background image for one row of a table, given that there are three columns in the table? Just the essence of the problem is that when I divide the table into three columns and apply the background to the row ( <tr>), then the background is divided into three parts ...
How to make sure that this does not happen? Below is the code:

<table>
                <tbody>
                    <tr>
                        <td>Title &amp; Description</td>
                        <td>date </td>
                        <td>who</td>
                    </tr>
                    <tr>
                        <td> </td>
                        <td> </td>
                        <td> </td>
                    </tr>

                    <tr>
                        <td>Weekly Digital Roundup </td>
                        <td>08/05/2014</td>
                        <td> Adam Campbell</td>
                    </tr>
                    <tr>
                        <td colspan="3"> Wi-Fi apple care volume reminder controls. My stations folders mac power ultimate upgrade. Shop online quicktime trackpad server aperture rumors education safari one to one.</td>
                        
                    </tr> 
                    <tr>
                        <td>somthing new </td>
                        <td>07/05/2014 </td>
                        <td>Viktor Csuka</td>
                        
                    </tr>
                    
                    <tr>
                        <td colspan="3">Backlit keyboard chess phone airport extreme support iPad. Accessories magsafe terminal final cut pro. Featured TV shows downloads digital color meter.</td>
                    </tr>
                    
                    <tr>
                         <td>  things coming around  </td> <td>05/05/2014 </td> <td> vivek ravin </td>     </td>                 
                    </tr>

                </tbody>
            </table>

table {
  width: 100%; 
  background: white; 
  color: #000;
  border-spacing: 1px; /* Расстояние между ячейками */	
}

tr:nth-child(2) > td {
  background: #fff;
  padding-top: 20px;
  border-bottom: 1px solid;
}

tr:nth-child(7) {
  background: url(../img/Bacgraund_line.png);
}

.forth_block {
  width:1920px;
  height:1041px;
  background: #8C8C8C;
}

.forth_block > .content_wrapper {
  width:1214px;
  height:890px;
  margin: 0 auto;
  padding: 0 0 0 0;	
}

.controlers {
  margin-left: 263px;
  float:left;
} 

tr:nth-child(3) > td {
    padding-top: 40px;
}

tr:nth-child(4) > td:nth-child(1) {
    padding-right: 607px;
    padding-bottom: 40px;
    background: #fff;
    padding-top: 20px;
    border-bottom: 1px solid;
}

tr:nth-child(5) > td {
    padding-top: 20px;
}

tr:nth-child(7) > td {
    padding-top: 189px;
    /* background: url(../img/Bacgraund_line.png); */
    height: 97px;
}

tr:nth-child(6) > td {
    padding-top: 40px;
    padding-right: 607px;
    padding-bottom: 40px;
}

Answer 1

The background is broken because there is a gap between the cells. Reduce it to zero and there will be an even background.