Mengatur jarak gambar di Pos Blogger

Secara default gambar yang diletakkan di halaman pos blogger terbagi menjadi 3 bagian :
1. Bagian Kiri              
2, Tengah            
3. Bagian Kanan
Bila dipaksakan dengan gambar lebih banyak maka salah satu gambar akan tersingkirkan ke bawah.Sekarang kita akan mencoba untuk mendekatkan jarak masing-masing gambar sehingga dengan ukuran yang sama akan didapat gambar lebih banyak untuk satu barisnya.

Sebagai contoh kita akan mengambil gambar Candi Borobudor yang sudah split menjadi 3 bagian yang sama.
1, Klik "gambar foto" di tab di atas
2. Pilih File
    >>> ambil file gambar di komputer
    yang sudah disiapkan
4. Bila telah selesai di upload, kemudian
    klik gambar untuk dimasukkan ke pos
    blog
5. Begitu seterusnya sampai yang kita
                                                                                    butuhkan masuk semua ke blog.
Lihat gambar di bawah :

Perhatikan kode HTML berikut ini :
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZwouyAYpsTBoNkq82Q8tQKcigqv9IDkOzJdSPLOD6_R0GANl-afoJrE3cL2esr-vLbbVntKnxWdLfEtWPXMabyhEG8RtrLqc6bV4IOBLoSgXNqRGcJ_KaCxZkKzAdSOmhF6LGIooiM2bv/s1600/download+(2)2_001.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZwouyAYpsTBoNkq82Q8tQKcigqv9IDkOzJdSPLOD6_R0GANl-afoJrE3cL2esr-vLbbVntKnxWdLfEtWPXMabyhEG8RtrLqc6bV4IOBLoSgXNqRGcJ_KaCxZkKzAdSOmhF6LGIooiM2bv/s1600/download+(2)2_001.jpg" height="200" width="168" /></a></div>

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfAwj2p-t-TLqbXoTjiY0U8MwRgy0r_CLC1iiwTxnfXFOREdbna20LiqHwjyDvckauHxZn6uuWkdGwkw-wU4VFUGIorUgRXk25-xS1lcMfODiVl7TLZGWTnDxpQb4ylYI44f970moxBuUc/s1600/download+(2)2_002.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfAwj2p-t-TLqbXoTjiY0U8MwRgy0r_CLC1iiwTxnfXFOREdbna20LiqHwjyDvckauHxZn6uuWkdGwkw-wU4VFUGIorUgRXk25-xS1lcMfODiVl7TLZGWTnDxpQb4ylYI44f970moxBuUc/s1600/download+(2)2_002.jpg" height="200" width="169" /></a></div>

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL6Fe_3Ng73fvZmdP0DXcCwqSjRVv81HiPbhndvc82FRkU2HyzlrR14MwWyZrgVu32Tr8ixMVEAPtwDYf-lu-ZoZiPdR2lB-bGRc5PYzh7vFZIGhFtqv6KbD9FtnfZWyStx6M8bK6mjUM2/s1600/download+(2)2_003.jpg" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL6Fe_3Ng73fvZmdP0DXcCwqSjRVv81HiPbhndvc82FRkU2HyzlrR14MwWyZrgVu32Tr8ixMVEAPtwDYf-lu-ZoZiPdR2lB-bGRc5PYzh7vFZIGhFtqv6KbD9FtnfZWyStx6M8bK6mjUM2/s1600/download+(2)2_003.jpg" height="200" width="169" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">

Warna biru  : merupakan tag yang harus dihapus agar 3 gambar menjadi satu kesatuan

Warna ungu : merupakan tag yang harus dihapus agar gambar yang ada disebelah kiri/ kanan
                        berada di tengah/ center

Warna merah : tag left dan right diganti dengan tag center

Sehingga hasilnya adalah sebagai berikut :
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZwouyAYpsTBoNkq82Q8tQKcigqv9IDkOzJdSPLOD6_R0GANl-afoJrE3cL2esr-vLbbVntKnxWdLfEtWPXMabyhEG8RtrLqc6bV4IOBLoSgXNqRGcJ_KaCxZkKzAdSOmhF6LGIooiM2bv/s1600/download+(2)2_001.jpg" imageanchor="1" style="clear: left; float:center; margin-bottom: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZwouyAYpsTBoNkq82Q8tQKcigqv9IDkOzJdSPLOD6_R0GANl-afoJrE3cL2esr-vLbbVntKnxWdLfEtWPXMabyhEG8RtrLqc6bV4IOBLoSgXNqRGcJ_KaCxZkKzAdSOmhF6LGIooiM2bv/s1600/download+(2)2_001.jpg" height="200" width="150" /></a>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfAwj2p-t-TLqbXoTjiY0U8MwRgy0r_CLC1iiwTxnfXFOREdbna20LiqHwjyDvckauHxZn6uuWkdGwkw-wU4VFUGIorUgRXk25-xS1lcMfODiVl7TLZGWTnDxpQb4ylYI44f970moxBuUc/s1600/download+(2)2_002.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfAwj2p-t-TLqbXoTjiY0U8MwRgy0r_CLC1iiwTxnfXFOREdbna20LiqHwjyDvckauHxZn6uuWkdGwkw-wU4VFUGIorUgRXk25-xS1lcMfODiVl7TLZGWTnDxpQb4ylYI44f970moxBuUc/s1600/download+(2)2_002.jpg" height="200" width="150" /></a>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL6Fe_3Ng73fvZmdP0DXcCwqSjRVv81HiPbhndvc82FRkU2HyzlrR14MwWyZrgVu32Tr8ixMVEAPtwDYf-lu-ZoZiPdR2lB-bGRc5PYzh7vFZIGhFtqv6KbD9FtnfZWyStx6M8bK6mjUM2/s1600/download+(2)2_003.jpg" imageanchor="1" style="clear: right; float: center; margin-bottom: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL6Fe_3Ng73fvZmdP0DXcCwqSjRVv81HiPbhndvc82FRkU2HyzlrR14MwWyZrgVu32Tr8ixMVEAPtwDYf-lu-ZoZiPdR2lB-bGRc5PYzh7vFZIGhFtqv6KbD9FtnfZWyStx6M8bK6mjUM2/s1600/download+(2)2_003.jpg" height="200" width="150" /></a></div>
<br />

Bagaimana? Lihat hasilnya dan mudah bukan?