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集。这些正在造成差距。

摆脱它们，并在td内定义padding值。

或者，您可以设置border-collapse: collapse;，但在这种情况下，请使用border-spacing CSS属性设置空格。 cellspacing和cellpadding已弃用。