2015-07-29 4 views
0

У меня есть следующий код, и я хочу добавить еще более горизонтальное пространство между данными таблицы. Cellpadding не работает, потому что он добавляет пространство как по горизонтали, так и по вертикали.Как добавить горизонтальное расстояние между несколькими <td>

Вот мой код:

<table style="width: 745px; margin-left: auto; margin-right: auto; font-family: Calibri; font-size: 16px;"> 
 
<tr> 
 
<td width="25%" style="border-bottom: 1px solid; border-bottom-color:#D5D5D5;"> 
 
    <strong>Parking:</strong> None 
 
    </td> 
 
    <td width="25%" style="border-bottom: 1px solid; border-bottom-color:#D5D5D5;"> 
 
    <strong>Floor Cover:</strong> Carpet 
 
    </td> 
 
    <td width="25%" style="border-bottom: 1px solid; border-bottom-color:#D5D5D5;"> 
 
    <strong>Extra Field:</strong> None 
 
    </td> 
 
    <td width="25%" style="border-bottom: 1px solid; border-bottom-color:#D5D5D5;"> 
 
    <strong>Extra Field:</strong> None 
 
    </td> 
 
</tr> 
 
<tr> 
 
<td width="25%" style="border-bottom: 1px solid; border-bottom-color:#D5D5D5;"><strong>Fencing:</strong> None </td> 
 
    <td width="25%" style="border-bottom: 1px solid; border-bottom-color:#D5D5D5;"><strong>Security:</strong> None</td> 
 
    <td width="25%" style="border-bottom: 1px solid; border-bottom-color:#D5D5D5;"><strong>Pool:</strong> None </td> 
 
    <td width="25%" style="border-bottom: 1px solid; border-bottom-color:#D5D5D5;"><strong>Topography:</strong> None </td> 
 
</tr> 
 
</table>

ответ

0

попробовать этот

.space { 
 
    padding-top: 20px ; 
 
    padding-bottom: 20px ; 
 
    border-bottom: 1px solid; 
 
    border-bottom-color: #D5D5D5; 
 
}
<table style="width: 745px; margin-left: auto; margin-right: auto; font-family: Calibri; font-size: 16px;"> 
 
<tr > 
 
<td class="space" width="25%" > 
 
    <strong>Parking:</strong> None 
 
    </td> 
 
    <td class="space" width="25%"> 
 
    <strong>Floor Cover:</strong> Carpet 
 
    </td> 
 
    <td class="space" width="25%"> 
 
    <strong>Extra Field:</strong> None 
 
    </td> 
 
    <td class="space" width="25%"> 
 
    <strong>Extra Field:</strong> None 
 
    </td> 
 
</tr> 
 
<tr> 
 
<td class="space" width="25%"><strong>Fencing:</strong> None </td> 
 
    <td class="space" width="25%"><strong>Security:</strong> None</td> 
 
    <td class="space" width="25%"><strong>Pool:</strong> None </td> 
 
    <td class="space" width="25%"><strong>Topography:</strong> None </td> 
 
</tr> 
 
</table>

+0

Кажется, что это добавляет пространство ниже и выше, сохраняя при этом влево и вправо неповрежденными , – Alex