Mas Uya

Selamat pagi semuanya,Disini saya melanjutkan Tutorial Membuat Template (1 Kolom Responsive).
Kali ini saya akan post yang 2 Kolom,Sebenarnya ini udah lama di request sama temen blogger saya,Nah untuk itu disini kita akan bahas Tutorial Membuat Template (2 Kolom Responsive).
Disini kita akan membuat template dengan 2 versi yaitu:
1.2 Kolom Post
2.Post biasa

Langsung saja kita mulai,Tapi sebelumnya download dahulu bahannya dibawah ini:
Bahan:
1.Kerangka Template 2 Kolom Post / Post Biasa
2.Pilih salah satu kerangka diatas,Jika sudah copy semua dan ganti template bawaan blogger (Buat Blog Baru)
3.Jika sudah,Kita mulai buat postnya,Pilih salah satu sesuai kerangka yang kalian pilih.CSS Post 2 Kolom / Post Biasa (Letakkan CSS Postnya Tepat Diatas ]]></b:skin>)
4.Nah,coba kalian lihat templatenya,Sudah terbentuk bukan?.
5.Nah kembali lagi ke template,Sekarang kita Modifikasi CSS Artikel
6.Modifikasi CSS Artikel Post 2 Kolom / (Simpan Tepat Dibawah ]]></b:skin>)
7.Nah,sudah jadi kan templatenya?.. Untuk Post Biasa Akan Nyusul Bersama Videonya
8.Oh iya,ada yang kurang.Pembuatan Responsive

Untuk Post 2 Kolom

/*Responsive*/
@media screen and (max-width:1040px){#wrapper-utama{width:100%}
.post{max-height:100%}
}
@media screen and (max-width:865px){.post{width:100%; padding:0px; margin-left:0px; border:0px solid #eaeaea; border-top:2px solid #00a3ff}
.post-body{padding-right:5px}
}
@media screen and (max-width:600px){#artikel-wrapper,#sidebar-wrapper{float:none; clear:both; width:100%}
.post{border-top:2px solid #00a3ff}
#header1, #header2{width:100%; float:none; clear:both; text-align:center; padding:0px; max-width:100%}
#atas .kiri, #atas .kanan{float:none; width:100%; max-width:100%}
#atas .kanan{border-top:1px solid #eee; padding:5px}
#kotak-cari{width:80%}
.suryamenu{display:none}
#nav2{display:inherit}
.comments .avatar-image-container{display:none}
.comments .comment-block{margin-left:0px}