Cara Membuat Gambar Menjadi Responsive di Blog

Summer IT - Assalamualaikum, kali ini saya ingin memberikan tips memperbaiki tampilan gambar pada konten yang responsive. Masalah yang sering sekali terjadi ketika kita membuat postingan dan ada gambarnya, ketika di buka memlalui perangkat mobile akan tampak gambar keluar jalur dari konten blog. hal itu menyebakan tampilan blog jadi kurang menarik. seperti gambar dibawah ini.
ScreenShoot diatas gambar tamak menyentuh pinggiran kanan konten, tidak ketengah konten. Dengan itu saya ingin memberikan sedikit tips cara mengatasi gambar yang tidak responsive tersebut dengan memberikan kode CSS untuk gambarnya ( Trik ini hanya digunakan yang menggunakan template responsive saja )

Silahkan buka blog anda > Template > Edit HTML > Salin dan pastekan kode CSS dibawah ini sebelum ]]></b:skin> atau </style>
.post-body img {
  max-width:100%;
  height:auto;
}
Kemudian simpan perubahan dan lihat hasilnya.
Jika masih tidak berhasil, silahan anda masuk ke Pos > Pilih artikel yang gambarnya anda mau perbaiki > Edit > Pilih HTML > Lalu cari kode dibawah ini.
style="margin-left: 1em; margin-right: 1em;"
Jika sudah ketemu, anda hapus kode tersebut dan langsung simpan artikel anda yang sudah diedit, lihat kembali hasilnya :-)
Sekian dari saya semoga bisa bermanfaat untuk anda semua.

Previous
Next Post »
Thanks for your comment