Cara Mengatasi First Image Tidak Presisi ( Rata Tengah ) Pada Template Plus UI

Hallo sahabat telatngoding pada kesempatan kali ini saya akan berbagi tutorial Cara Mengatasi First Image Tidak Presisi ( Rata Tengah ) Pada Template Plus UI dengan mudah.

Pada kasus sebelumnya saya sudah membahas tentang cara mengatasi first image yang tidak presisi pada template Median UI, dan sekarang hal yang serupa terjadi pada template Plus UI.

Pada template Plus UI ini gambar lebih menyamping ke kanan sehingga membuat tampilan pada blog yang tidak rapih dan kurang enak di lihat.

Walaupun hal tersebut kurang diperhatikan oleh pengunjung blog namun bagi saya pribadi sangat mengganggu karena bisa merusak tampilan yang rapih menjadi tidak rapih. Hal tersebut memberikan kesan bahwa blog kita kurang profesional.

Lalu bagaimana cara mengatasi firsr image tersebut supaya presisi atau rata tengah pada template plus ui?

Hal yang harus anda lakukan adalah mengedit CSS pada template plus ui tersebut supaya menjadi presisi.

Untuk lebih jelasnya silahkan ikuti tutorial di bawah ini.

---

Cara Mengatasi First Image Tidak Presisi ( Rata Tengah ) Pada Template Plus UI

Silahkan masuk ke blog kalian lalu pilih tema dan edit html

Cari kode /* Article Style Responsive */ selanjutnya hapus kod dari @media screen sampai {display:none}} dan ganti dengan kode dibawah ini:

@media screen and (max-width: 640px){.pS img.full{width:calc(100% + 40px);left:-20px;right:-20px; border-radius:0} .note{font-size:13px} .scImg{flex-wrap:nowrap;justify-content:flex-start;position:relative;width:calc(100% + 40px);left:-20px;right:-20px;padding:0 13px; overflow-y:hidden;overflow-x:scroll;scroll-behavior:smooth;scroll-snap-type:x mandatory; -ms-overflow-style:none;-webkit-overflow-scrolling:touch} .scImg >*{flex:0 0 80%;scroll-snap-align:center} .ps .table{position:relative; width:calc(100% + 40px);left:-20px;right:-20px;padding:0 20px; display:flex}} @media screen and (max-width:700px){.hdImg{width:100%;left:0;right:0} .hdImg >*, .shImg >*{width:100%;margin:0 0 10px} .ps .tr-caption, .psCaption, figcaption{font-size:13px} .btnF >*{flex-grow:1;justify-content:center}.btnF >*:first-child{flex:0 0 auto} .dlBox a{width:42px;height:42px;justify-content:center} .dlBox a::after, .dlBox .icon::after{display:none} .pS .separator a{display:block!important;margin:0!important}}

Simpan template kalian dan selesai.

Cara yang sangat mudah untuk membuat first image atau gambar pada template Plus UI menjadi rata tengah. Terimakasih sudah berkunjung.

Baca juga :

Go to Link