Membuat Postingan Dalam Dua Kolom

Tips Membuat Postingan Dalam Dua Kolom : Ingin selalu “tampil beda” dalam segala hal adalah keinginan dari setiap blogger tidak terkecuali dalam variasi kolom dalam postingan. Yang selama ini hanya dapat membuat postingan dalam satu kolom maka dengan tips ini kita dapat membuat sedikit variasi menjadi tiga kolom
. Dengan tips ini, kita dapat mengaplikasikan untuk berbagai tujuan, misalnya postingan yang berisi daftar atau list. Jika tertarik, ikuti tipsnya bersama Tips dan Trik Blog berikut ini.

Untuk membuat postingan menjadi dua kolom, kita gunakan kode berikut ini dalam halaman pengetikan (post editor) dengan format sebagai berikut.

<div style="width: 45%; float: left;"> tulisan </div>
<div style="width: 45%; float: right;"> tulisan </div>

Keterangan

Tulisan yang kita ketikkan di antara kode yang atas akan berada di kolom sebelah kiri

Tulisan yang kita ketikkan di antara kode yang bawah akan berada di kolom sebelah kanan

Agar kelihatan rapi, kita dapat menambahkan atribut untuk perataan teks (text-align), misalnya perataan penuh (justify), maka menjadi selengkapnya menjadi seperti di bawah ini.

<div style="width: 45%; float: left; text-align:justify;"> tulisan</div>
<div style="width: 45%; float: right; text-align:justify;"> tulisan</div>

Ilustrasi

<div style="width: 45%; float: left;"> tulisan ini akan berada pada kolom sebelah kiri tulisan ini akan berada pada kolom sebelah kiri</div> <div style="width: 45%; float: right;"> tulisan ini akan berada pada kolom sebelah kanan tulisan ini akan berada pada kolom sebelah kanan </div>

Dengan ilustrasi di atas, maka “tulisan ini akan berada pada kolom sebelah kiri tulisan ini akan berada pada kolom sebelah kiri tulisan ini akan berada pada kolom sebelah kiri” akan menjadi tulisan yang berada di kolom sebelah kiri.

Sedangkan “tulisan ini akan berada pada kolom sebelah kanan tulisan ini akan berada pada kolom sebelah kanan” akan menjadi tulisan yang berada di kolom sebelah kanan.

Dan di bawah ini adalah screenshot dari ilustrasi di atas.

Untuk lebih jelasnya, silakan praktek sendiri-sendiri, ya!!

Sumber : tips-trik-blog.blogspot.com