Pengaturan padding tabel
Padding adalah jarak antara isi atau
content, berupa teks ataupun gambar dengan batas dalam dari sel tersebut. Style
padding ini dapat diterapkan pada elemen HTML <td> (kolom). Ukuran yang digunakan dapat berupa cm, atau
px (piksel). Property style untuk pengaturan padding yang mengelilingi content
adalah td{ padding:15px; }
Padding dapat pula diatur untuk bagian
tertentu saja, misalnya adalah :
- padding-top jarak dari atas sel
- padding-bottom jarak dari bawah sel
- padding-left jarak dari kiri sel
- padding-right jarak dari kanan sel.
Berikut ini adalah beberapa contoh penggunaan
style padding pada tabel :
<html>
<head>
<style>
table,td,th
{ border:1px solid black; }
td
{ text-align:right;height:50px;vertical-align:bottom;
padding:15px; }
</style>
</head>
<body>
<table>
<tr>
<th>Nama Depan</th>
<th>Nama</th>
</td>
</tr>
<tr>
<td>Novero</td>
<td>Dayand</tr>
<tr>
<td>Adelin</td>
<td>Larasati ra</td>
</tr>
<tr>
<td>Adika</td>
<td>Dayandra</td>
</tr>
</table>
</body>
</html>
Jika menginginkan padding diarea tertentu
saja, misalnya padding untuk area kanan maka dapat diterap padding-right
<html>
<head>
<style>
table,td,th
{ border:1px solid black; }
td
{ text-align:right;height:50px;vertical-align:bottom;
padding-right: 70px; }
</style>
</head>
<body>
<table>
<tr>
<th>Nama Depan</th>
<th>Nama</th>
</tr>
<tr>
<td>Adelin</td>
<td>Larasati</td>
</tr>
<tr>
<td>Novero</td>
<td>Dayandra</td>
</tr>
<tr>
<td>Adika</td>
<td>Dayandra</td>
</tr>
</table>
</body>
</html
