Memberi Border Putih Pada Foto (HTML + CSS)

Bagaimana cara membuat foto jadi terlihat memiliki border putih di blogger?
Yang seperti ini?

Cara termudahnya adalah memilih template yang menyediakan fasilitas untuk itu..
Ada cara lain?
Ada sih, kalo bersedia mau agak repot...

• Pada saat mem-posting, di editornya PILIH tampilan HTML
• lalu untuk membuat foto yang ber-border putih ketik kode yang kira-kira seperti berikut ini

<div id="background" style="background-color:gray;text-align:center;padding:10px 10px 10px 10px">
 <div id="border" style="display: inline-block;background-color:fff;padding: 8px 8px 8px 8px">
  <img src=http://twitpic.com/show/thumb/tq7m5.jpg" />
 </div>
</div>

Penggunaan attribute id pada div di contoh ini tidak berpengaruh apa-apa hanya untuk mempermudah mengikuti penjelasan saja, jadi boleh dihapus.

• Pertama, jika border-nya nanti berwarna putih maka background/ ruang diluar diluar border itu sebaiknya diberi warna lain agar bordernya terlihat. Maka pada contoh attribute style pada div background kita tambahkan pernyataan css, background-color, pada contoh ini saya beri warna abu-abu (gray).
  

  <div id="background" style="...;background-color:gray;...

• Untuk membuat fotonya berada ditengah, pada attribute style div background tambahkan pernyataan text-align:center. Dan juga pada div border masukkan pernyataan display:inline-block
  

  <div id="background" style="...;text-align:center;...
   <div id="border" style="display: inline-block;...
  

  Saya sempat membaca bahwa display:inline-block tidak di tersedia di IE 7 ke bawah tapi ga tau juga yah, udah lama ga pake IE.


• Untuk membuat border (pinggiran) foto, ubah warna div border menjadi putih (atau warna lain pun boleh)
  

  <div id="border" style="background-color:fff;...

  atau bisa juga
  

  <div id="border" style="...;background-color:white;...

  Lalu buat jarak ke foto (lebar border), pada contoh ini saya menginginkan lebar 8 pixel.
  

  <div id="border" style="...;padding: 8px 8px 8px 8px;...
  

• Nah, di dalam div border barulah ditempatkan gambarnya, di contoh ini saya menggunakan gambar http://twitpic.com/show/thumb/tq7m5.jpg
  

  <img src="http://twitpic.com/show/thumb/tq7m5.jpg" />
  

• Untuk penggunaan umum copy paste saja code ini, lalu isikan nama file gambarnya di src=""
  

  <div style="text-align:center">
   <div style="display: inline-block;background-color:fff;padding: 8px 8px 8px 8px">
    <img src="" />
   </div>
  </div>