Cara Membuat Template Bagian Content-Wrapper Menjadi Responsive

Namecheap.com
Cara Membuat Home Postingan Di Mywapblog Lebih baik dan Resfonsif

Cara membuat home postingan mywapblog simple keren - Dikesempatan kali ini saya akan berbagi trik tentang blog ponsel. Bagaimana cara membuat di layar home blog mywapblog tampilan nya agar responsife dan simple.

Nah sudah mengerti sobat mbw sekalian dengan maksud saya tadi. Tentang cara membuat tampilan postingan mywapblog agar simple dan keren, kalau untuk yang tampilan biasanya sering kita lihat tampilan dari mywapblog seperti gambar di bawah ini.

Lalu bagaimana cara merubah tampilan di layar bagian content-wrapper agar terlihat lebih rapi atau juga simple tetapi bagus untuk di pandang. Saya akan bagikan trik ini pada sobat semua dengan kode CSS nya agar tampilan di content-wrapper terlihat lebih responsive jika di akses melalui ponsel dan tablet.

Cara ini termasuk salah satu cara agar CSS kita tampil maksimal dan terlihat lebih user frendly untuk penggunjung blog yang mana mencari artikel pada halaman awal blog.

Silahkan kalian salin semua kode yang ada di bawah ini!
#content {background :#fff;margin :0;padding :3px 6px 6px;}.post {margin :0 0 6px;padding :6px;font-size :13px;border :1px solid #e5e5e5;position :relative;}.post-single {margin :0 0 6px;padding :6px;font-size :13px;border :1px solid #e5e5e5;position :relative;width :auto;}.thumbnail {border :0 !important;margin :6px !important;width :45px !important;height :45px !important;padding :0 !important;position :absolute;top :0;left :0;right :0;}.post:before {position :absolute;top :0;left :0;right :0;width :45px;height :45px;margin :6px;padding :0;content :"";background :url() center no-repeat;border :0;background-size :100% 100%;}.post-meta {color :#888;margin :0;padding :0;}.post .post-meta {overflow :hidden;padding :0 0 6px 51px;position :relative;text-align :left;}.post-single .post-meta {margin-bottom :6px;text-align :left;}.post-meta .title {color :#222;font-weight :bold;font-size :13px;margin :0;padding :0;}.post-meta .title a {display :block;font-weight :bold;font-size :13px;}.post-meta .title a:before {content :'';display :block;float :left;margin :0 0 0 -51px;padding :0;position :relative;width :45px;height :45px;z-index :3;}.post-meta .categories {background :#f5f5f5;color :#222;font-size :12px;font-weight :normal;margin :4px 0 0;padding :6px;}.post .post-content {overflow :hidden;margin :auto;padding :0px;font-size :0;height :0;}.post-single .post-content {overflow-wrap :break-word;margin :6px 0;text-align :justify;}.post-single .post-content img {max-width :95%;text-align :center;}.post-meta2 {margin :0;padding :0 0 0 51px;text-align :left;}.post-meta2 a {color :#ffcc00;font-weight :bold;margin :0;padding :0;}.post-meta2 span {content : " Komentar";}
Kalau sudah, silahkan sobat letakan pada CSS mywapblog sobat, dengan tema yang bertipe standar jangan yang lain, kecuali kalian paham dengan macam-macam kode CSS.

Nah sahabat mywapblog semua, mungkin inilah yang dapat admin sampaikan pada sahabat mywapblog semua, jika dalam penyampaian dan perkataan yang salah ada didalam artikel ini, saya mohon ma'af yang sebesar-besarnya kepada penggunjung blog semua.

(Happy blogging)

Subscribe to receive free email updates:

0 Response to "Cara Membuat Template Bagian Content-Wrapper Menjadi Responsive"

Post a Comment