Rabu, 23 Juni 2010


Mengatasi Masalah Tabel Yang Melorot Pada Artikel

Mengatasi Masalah Tabel Yang Melorot Pada Artikel - Ketika kita membuat sebuah artikel untuk blog, kita kadang membutuhkan tabel misalnya untuk mencantumkan daftar harga suatu produk dan lain-lain. Namun kendala yang sering di hadapi oleh kalangan blogger pemula seperti saya sendiri yaitu posisi tabel yang biasanya jauh melorot kebawah dan khususnya artikel pada blogspot. Saya akan memberi contoh tampilan tabel melorot yang saya maksud namun tabel berikut saya buat cukup sederhana.

Contoh tabelnya seperti berikut :

DAFTAR NAMA ANGGOTA


























NAMAUMURJENIS KELAMIN
Bob Sadino18 TahunPria
Bob Hasan24 TahunPria
Sri Mulyani40 TahunWanita
Andi Malarangeng35 TahunPria


Coba lihat contoh di atas, tabelnya berada jauh dibawah judul "DAFTAR NAMA ANGGOTA" padahal kode yang saya gunakan ditulis bersambung dengan judul dan tanpa kode <br/> tapi kenapa hasilnya terlalu kebawah ?

Coba bandingkan dengan tabel berikut :

DAFTAR NAMA ANGGOTA

NAMA UMUR JENIS KELAMIN
Bob Sadino 18 Tahun Pria
Bob Hasan 24 Tahun Pria
Sri Mulyani 40 Tahun Wanita
Andi Malarangeng 35 Tahun Pria


Bentuk tabel yang kedua letaknya tidak melorot dan berada tepat sesuai yang kita inginkan. Ternyata permasalahannya sangat simple dimana yang pertama saya menggunakan kode dengan SPASI KEBAWAH berurut seperti ini :

<table width="550" border="1">
<tr>
<td align="center">
NAMA
</td>
<td align="center">
UMUR
</td>
<td align="center">
JENIS KELAMIN
</td>
</tr>
<tr>
<td align="center">
Bob Sadino
</td>
<td align="center">
18 Tahun
</td>
<td align="center">
Pria
</td>
</tr>
<tr>
<td align="center">
Bob Hasan
</td>
<td align="center">
24 Tahun
</td>
<td align="center">
Pria
</td>
</tr>
<tr>
<td align="center">
Sri Mulyani
</td>
<td align="center">
40 Tahun
</td>
<td align="center">
Wanita
</td>
</tr>
<tr>
<td align="center">
Andi Malarangeng
</td>
<td align="center">
35 Tahun
</td>
<td align="center">
Pria
</td>
</tr>
</table>

Sedangkan untuk tabel kedua saya tidak menggunakan SPASI KEBAWAH tapi hanya menggunakan SPASI STANDARD dimana bentuk kodenya saya susun seperti ini :

<table width="550" border="1"><tr><td align="center"> NAMA</td><td align="center"> UMUR</td><td align="center"> JENIS KELAMIN</td></tr><tr><td align="center"> Bob Sadino</td><td align="center"> 18 Tahun</td><td align="center"> Pria</td></tr><tr><td align="center"> Bob Hasan</td><td align="center"> 24 Tahun</td><td align="center"> Pria</td></tr><tr><td align="center"> Sri Mulyani</td><td align="center"> 40 Tahun</td><td align="center"> Wanita</td></tr><tr><td align="center"> Andi Malarangeng</td><td align="center"> 35 Tahun</td><td align="center"> Pria</td></tr></table>

Jadi kesimpulannya agar tabel yang kita bentuk tidak berada jauh dibawah judul maka jangan menggunakan SPASI KEBAWAH pada kode HTML. Alasannya karena artikel pada blog membaca SPASI KEBAWAH sebagai kode <br/>.
Oleh karena tampilan tabel yang kita pajang berada jauh dibawah yang kita inginkan dan semakin panjang tabelnya semakin jauh pula tabel itu bergeser kebawah.

Sekian infroimasi dari saya, mudah-mudahan bermamfaat !

Salam : Basri Tamang

8 komentar:

Ares Shadux's on 14 September 2010 23.32 mengatakan...

terima kasih atas infonya..... jadi ga turun lagi tabelnya

Basri Tamang mengatakan...

Sama-sama, terima kasih atas kunjungannya :)

wawan on 25 September 2010 11.05 mengatakan...

Terima kasih infonya sangat bermanfaat,oh ya saya mau tanya kenapa ya saat di edit halamannya tabelnya suka melorot kebawah pada saat di tayangkan laman

Basri Tamang mengatakan...

Itu karena kodenya menggunakan spasi kebawah.
Spasi kebawah terbca dengan perintah HTML kode

Alminist on 27 September 2010 09.08 mengatakan...

5 jam menaikan tabel supaya dekat dengan judul posting, akhirnya ketemu Kang Basri Tamang, Matur nuwun

Basri Tamang mengatakan...

Alhamdulillah :D

Onjou on 10 Oktober 2010 20.26 mengatakan...

boleh juga tuh mas yg ada paling atas banget,, seklian ane minta jugaaaa makyuss deh, heheheeh

Basri Tamang mengatakan...

Silahkan aja disedot apa yang ada disini gan :D

Posting Komentar

Anda tidak diperbolehkan berkomentar bersifat promosi produk yang sama dengan di artikel, Apabila anda tetap berkomentar maka komentar anda akan kami Hapus