membuat text responsive di blog
hallo semua pada kesempatan kali ini saya akan membagikan cara membuat text responsive di blog, jadi saat artikel ini di buat saya menggunakan template median ui v.1.4 sebenarnya template ini sudah responsive untuk tampilannya namun masi ada kendala di text nya jika kita menulis tulisan panjang tanpa spasi seperti menyematkan url pada postingan maka ditampilan pada mobile akan tampak terpotong seperti gambar di bawah ini.
untuk hal tersebut tidak hanya pada postingan saja, namun pada komentar juga demekian, tentu hal ini membuat blog kita jadi kurang enak di pandang jika di akses melalui mobile karna ada tulisan yang terpotong.
buat kalian yang mengalami hal yang sama seperti saya, jangan khawatir karena di sini saya akan membantu kendala kalian, ok langsung saja silakan simak tutorialnya di bawah ini.
Membuat Text Responsive Di Blog
silakan masuk ke blogger pilih tema dan edit html gunakan ctrl f cari kode seperti body{ jika sudah ketemu letakkan kode css ini pada class tersebut.
word-wrap:break-word;
di sini saya contohkan pada template yang saya gunakan median ui css body nya seperti ini
body{position:relative:;margin::0:;padding::0!important:;width::100%:;font-family::$(body.font):;font-size::14px:;color::$(text.colors):;background-color::$(body.bg.colors):;-webkit-font-smoothing::antialiased:;-webkit-transition::all .1s ease:;transition::all .1s ease:}
dan ini setelah saya menambahkan kode tersebut, lihat bagian yang saya tandai. kalian harus menambahkan titik koma ; jika pada akhir css tidak memiliki titik koma ; namun jika sebaliknya kalian tidak perlu menambahkanya lagi.
body{position:relative:;margin::0:;padding::0!important:;width::100%:;font-family::$(body.font):;font-size::14px:;color::$(text.colors):;background-color::$(body.bg.colors):;-webkit-font-smoothing::antialiased:;-webkit-transition::all .1s ease:;transition::all .1s ease:word-wrap:break-word;}
jika sudah jangan lupa untuk klik simpan dan lihat hasilnya apakah tulisannya masi terpotong atau keluar dari layar jika di akses melalui mobile. ok jadi sekian dari saya cara membuat text responsive di blog semoga bermanfaat.
6 komentar