Sunday, May 31, 2009

Menghindari Space Saat Membuat Tabel

Categories:

Saat membuat tabel pada blogger.com, mungkin begitu banyak orang komplain. "Lho, koq jadi banyak spasi begini?". Hohohoho... Tenang saja ada solusinya. Yups, actually ada 2 solusi yang aku tahu selama aku belajar nge-blog. Kata orang ilmu seseorang kan nambah jika dibagi-bagikan. So, biar ilmuku nambah, akan kubagikan ilmuku ini. Simak terusss...


Btw, kenapa muncul banyak spasi ketika kita buat tabel (lewat tag HTML tentunya)? Karena saat kita membuat tabel, biasanya kita akan menekan tombol ENTER pada tiap peralihan command HTML dengan tujuan supaya tag tersebut bisa dibaca dengan nyaman oleh mata manusia. Ya enggak? Nah, ENTER yang kepencet akan terakumulasi sehingga membuat jarak spasi yang naudzubillah banyaknya. Contohnya begini, jika kita akan membuat tabel yang isinya seperti tabel di bawah ini (yang liatnya lewat facebook, mungkin gak bisa liat table-nya):

NamaNIMIPK
Paijo1130900013.9
Painem1130900023.9

maka tag HTML-nya:

<table width="96%" align="center" border="1" bordercolor="black">
<tbody>
<tr style="text-align: center; font-weight: bold;">
<td>Nama</td>
<td>NIM</td>
<td>IPK</td>
</tr>
<tr>
<td>Paijo</td>
<td>113090001</td>
<td>3.9</td>
</tr>
<tr>
<td>Painem</td>
<td>113090002</td>
<td>3.9</td>
</tr>
</tbody>
</table>


Nah, jika kamu pake tag macam itu, nanti akan muncul spasi diatas tabel yang memisahkan text terakhir mu dengan tabel. So, ini solusinya:

1. Jangan gunakan tombol Enter, jadi begini:


<table width="96%" align="center" border="1" bordercolor="black"><tbody><tr style="text-align: center; font-weight: bold;"><td>Nama</td><td>NIM</td><td>IPK</td></tr><tr><td>Paijo</td><td>1130900019</td><td>3.9</td></tr><tr><td>Painem</td><td>113090002</td><td>3.9</td></tr><tbody></table>


Tapi menggunakan cara itu menjadikan tag HTML yang kita buat menjadi sangat tidak nyaman untuk dilihat. Terus, gimana donk? Tenang masih ada cara ke-2

2. Tambahkan kode berikut:


<style type="text/css">.nobrtable br { display: none }</style>
<div class="nobrtable">


//Put Your HTML table tag here//

</div>


Nah, nanti kodenya jadi seperti ini:

<style type="text/css">.nobrtable br { display: none }</style>
<div class="nobrtable">
<table width="96%" align="center" border="1" bordercolor="black">
<tbody>
<tr style="text-align: center; font-weight: bold;">
<td>Nama</td>
<td>NIM</td>
<td>IPK</td>
</tr>
<tr>
<td>Paijo</td>
<td>113090001</td>
<td>3.9</td>
</tr>
<tr>
<td>Painem</td>
<td>113090002</td>
<td>3.9</td>
</tr>
</tbody>
</table>
</div>

Dengan demikian, tag HTML tetap enak dipandang namun tabel yang kita buat tetap dalam kondisi normal tanpa spasi yang berlebihan.

Yosh, mungkin segitu saja untuk postingan kali ini. Semoga bermanfaat...

Spread The Love, Share Our Article

Related Posts

No Response to "Menghindari Space Saat Membuat Tabel"

Post a Comment

I'll be glad if you leave a comment below. But, please don't spam my blog. Any comments containing spams, porn matters, harassment, and insulting words will be deleted from Luka Angin.