Trik Mengatur Posisi Gambar Header Rata Tengah, Kiri, dan Kanan

Tips dan Trik Mengatur Posisi Gambar Header Rata Tengah, Kiri, dan Kanan

Kadang kita merasa kebingungan gaimana caranya  mengatur posisi Gambar Header Rata Tengah, Kiri, dan Kanan. 

Posisi Gambar Header Rata Tengah, Kiri, dan Kanan, untuk kali ini bahacyl akan berbagi trik tentang Cara Mengatur Posisi Gambar Header Rata Tengah, Kiri, dan Kanan.

Header blog bisa diartikan sebagai kepala blog yang dimana Header blog ini sangat penting untuk kebaikan blog kita sendiri. Beberapa blogger membuat header blog dengan sebuah gambar namun ada juga hanya dengan tulisan. Untuk Header blog dengan gambar biasanya mengalami penempatan yang kurang sesuai dengan keinginan kita, biasanya setelah mengganti header blog dengan sebuah gambar maka header blog berada di bagian tengah padahal keinginan kita header blog berada di bagian kiri dan begitu pun lainnya.

Dengan pernyataan diatas saya punya solusinya yang semoga dapat bermanfaat. Nah, mengatasi itu perhatikan di bawah ini :

1. Anda harus login di blogger.com
2. Kemudian pilih Template --> Edit HTML
3. Cari kata #header-wrapper atau #header-inner atau #header img. Gunakan Ctrl + F untuk mempermudah mencarinya.
4. Jika sudah ketemu biasanya akan tampak seperti ini (gambar header berada di tengah) :

#header-wrapper{background:#fff; margin:0 auto; width:970px; overflow:hidden}
#header-inner{background-position:center; margin-left:auto; margin-right:auto}
#header{padding-left:20px; font-family:arial; width:900px; text-align:left; float:left; height:70px; color:#000}
#header h1{font:25px "Segoe UI",Arial; font-weight:bold; color:#000; text-align:left; margin-top:5px; padding : 6px 0 8px}
#header a{text-decoration:none; color:#000; border:0}
#header .description{font-size:1em}
#header img{margin-left:auto; margin-right:auto}
#outer-wrapper{background:#fff; box-shadow:0 0 20px #6d5d96;

Perlu anda ketahui kode diatas berbeda-beda untuk setiap blog cari cari yang hampir sama diatas.
5. Untuk mengatur posisi gambar header berada di sebelah kiri, anda tinggal ubah kode :

#header img{margin-left:auto; margin-right:auto}

menjadi

#header img{text-align:left}

maka hasilnya seperti ini :

text-align:left

6. Untuk mengatur posisi gambar header berada di tengah, anda tinggal ubah kode :

#header img{margin-left:auto; margin-right:auto}

menjadi

#header img{margin-left:auto; margin-right:auto} 

maka hasilnya seperti ini :

7. Untuk mengatur posisi gambar header berada di sebalah kanan, anda tinggal ubah kode :

#header img{margin-left:auto; margin-right:auto}

menjadi

#header img{margin-left:auto}

maka hasilnya  akan tampil disebelah kanan.

8. Setelah itu anda tinggal save dan lihat hasilnya. ?

Demikian artikel saya tentang trik tentang Cara Mengatur Posisi Gambar Header Rata Tengah, Kiri, dan Kanan. Semoga dapat bermanfaat dengan baik.

Tips dan Trik Mengatur Posisi Gambar Header Rata Tengah, Kiri, dan Kanan

Kadang kita merasa kebingungan gaimana caranya  mengatur posisi Gambar Header Rata Tengah, Kiri, dan Kanan. 

Posisi Gambar Header Rata Tengah, Kiri, dan Kanan, untuk kali ini bahacyl akan berbagi trik tentang Cara Mengatur Posisi Gambar Header Rata Tengah, Kiri, dan Kanan.

Header blog bisa diartikan sebagai kepala blog yang dimana Header blog ini sangat penting untuk kebaikan blog kita sendiri. Beberapa blogger membuat header blog dengan sebuah gambar namun ada juga hanya dengan tulisan. Untuk Header blog dengan gambar biasanya mengalami penempatan yang kurang sesuai dengan keinginan kita, biasanya setelah mengganti header blog dengan sebuah gambar maka header blog berada di bagian tengah padahal keinginan kita header blog berada di bagian kiri dan begitu pun lainnya.

Dengan pernyataan diatas saya punya solusinya yang semoga dapat bermanfaat. Nah, mengatasi itu perhatikan di bawah ini :

1. Anda harus login di blogger.com
2. Kemudian pilih Template --> Edit HTML
3. Cari kata #header-wrapper atau #header-inner atau #header img. Gunakan Ctrl + F untuk mempermudah mencarinya.
4. Jika sudah ketemu biasanya akan tampak seperti ini (gambar header berada di tengah) :

#header-wrapper{background:#fff; margin:0 auto; width:970px; overflow:hidden}
#header-inner{background-position:center; margin-left:auto; margin-right:auto}
#header{padding-left:20px; font-family:arial; width:900px; text-align:left; float:left; height:70px; color:#000}
#header h1{font:25px "Segoe UI",Arial; font-weight:bold; color:#000; text-align:left; margin-top:5px; padding : 6px 0 8px}
#header a{text-decoration:none; color:#000; border:0}
#header .description{font-size:1em}
#header img{margin-left:auto; margin-right:auto}
#outer-wrapper{background:#fff; box-shadow:0 0 20px #6d5d96;

Perlu anda ketahui kode diatas berbeda-beda untuk setiap blog cari cari yang hampir sama diatas.
5. Untuk mengatur posisi gambar header berada di sebelah kiri, anda tinggal ubah kode :

#header img{margin-left:auto; margin-right:auto}

menjadi

#header img{text-align:left}

maka hasilnya seperti ini :

text-align:left

6. Untuk mengatur posisi gambar header berada di tengah, anda tinggal ubah kode :

#header img{margin-left:auto; margin-right:auto}

menjadi

#header img{margin-left:auto; margin-right:auto} 

maka hasilnya seperti ini :

7. Untuk mengatur posisi gambar header berada di sebalah kanan, anda tinggal ubah kode :

#header img{margin-left:auto; margin-right:auto}

menjadi

#header img{margin-left:auto}

maka hasilnya  akan tampil disebelah kanan.

8. Setelah itu anda tinggal save dan lihat hasilnya. ?

Demikian artikel saya tentang trik tentang Cara Mengatur Posisi Gambar Header Rata Tengah, Kiri, dan Kanan. Semoga dapat bermanfaat dengan baik.