td에서 테두리. html css 문제

Question

여기에서 달성하고자하는 것 : http://jsfiddle.net/LxwXc/3/

이 코드는 웹 사이트에있을 때 tds 사이에 간격이 있습니다. 어떤 아이디어가 될 수 있습니까? 난 그냥 ... 미친려고하고

.goodtable td 

{ 

    border-bottom: 1px solid black; 

    border-left: none; 

    border-right: none; 

    border-top: none; 

    padding: 10px; 

} 

</style> 



<table class="goodtable" cellpadding="10" cellspacing="8"> 

    <tr> 

     <td width="150px">Username:</td> 

     <td width="150px">opera</td> 

    </tr> 



    <tr> 

     <td>Gender:</td> 

     <td>Male</td> 

    </tr>  



    <tr> 

     <td>Age:</td> 

     <td>19 (1992-01-01)</td> 

    </tr> 



    <tr> 

     <td>Country, city:</td> 

     <td>hey, Afghanistan</td> 

    </tr> 




    <tr> 

     <td>Height:</td> 

     <td>187 centimetres</td> 

    </tr> 


</table> 

Answer 1

당신은 cellpadding 및 cellspacing 세트가 있습니다. 그것들은 공백을 일으키고 있습니다.

대신에 안에 padding 값을 정의하십시오.

또는 border-collapse: collapse;으로 설정할 수 있지만이 경우 border-spacing CSS 속성을 사용하여 공백을 설정하십시오. cellspacing 및 cellpadding은 더 이상 사용되지 않습니다.