Membuat Postingan Multi Kolom

Pernahkan anda membaca sebuah surat kabar (koran). Pada kenyataannya paragraf di surat kabar sangat multi kolom. Membuat posting multi kolom untuk sebuah artikel blog yang menyerupai majalah dan koran mungkin akan terlihat unik dalam sebuah tampilan artikel, posting artikel multi kolom ini akan sangat berguna dari segi tampilan suatu post utruk menampilkan bentuk yang berbeda dengan post-post pada umumnya. Seperti halnya tulisan saya yang berjudul Mencoba Mengerti.

Pada postingan ini saya ingin memberikan beberapa informasi bahwa pembuatan postingan ini adalah secara manual, dimana kita membutuhkan kode script yang berfungsi untuk membuat paragraf tulisan kita secara otomatis terbagi menjadi 3 kolom. Selain gampang tips ini sangat bermanfaat buat anda yang suka menulis panjang, sehingga dapat memperindah tampilan tulisan anda.

DEMO

Tertarik untuk membuat posting artikel multi kolom dalam blog kalian supaya mempunyai tampilan yang berbeda dengan tampilan posting pada umumnya? kalian bisa memakai kode css dibawah ini untuk mewujudkan itu.

-moz-column-count: 3;
-moz-column-gap: 10px;
-webkit-column-count: 3;
-webkit-column-gap: 10px;
column-count: 3;
column-gap: 10px;

Kode css tersebut diatas merupakan badan dari css yang membentuk perintah membuat 3 kolom dengan jarak 10 px per kolom, untuk menampilkan post artikel multi kolom dalam suatu postingan, kalian perlu menambahkan kode css tersebut dalam postingan dalam mode Edit HTML menjadi seperti ini :

<style type="text/css">
#posting3kolom {
-moz-column-count: 3;
-moz-column-gap: 10px;
-webkit-column-count: 3;
-webkit-column-gap: 10px;
column-count: 3;
column-gap: 10px;}
</style>
<div id="posting3kolom">ISI POSTINGAN</div>

Cara tersebut diatas dilakukan dengan cara manual untuk menampilkaan post arikel multi kolom pada post-post tertentu dan dalam contoh tersebut untuk membuat 3 kolom, jika menginginkan menjadi 4 atau 5 kolom, kalian bisa mengganti angka dalam column count menjadi 4 atau 5, seperti pada alenia ini saya mengganti menjadi 2 kolom untuk menjadi pembeda dengan kode css yang diterapkan diatas. Semoga bermanfaat, mohon maaf jika ada salah. (Jkt/2012)