Alinhar várias imagens no post com tabela

Me perguntaram como poderia alinhar várias imagens nos posts do blog. Aí está uma solução. Antiga, em desuso, mas ainda assim uma solução. O ruim é ter que sempre ficar colando esse código no HTML da área de postagem do Blogger, trocar código, inserir links...ufa, quanto trabalho ! Mas quem gosta de um blog bem cuidado, com tudo em seu devido lugar, acha que isso nem é tão trabalhoso assim.


Copie  o código e cole no editor de postagens no Modo HTML

<table border="0" bordercolor="”blue”" style="height: ”80%”px;" whidth="”">

<tbody>
<tr>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 1" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 1" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 2" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 2" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 3" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 3" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 4" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 4" height="130" width="200" /></a></div>
</td>


</tr>
<tr>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 5" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 5" height="130" width="200" /></a></div>
</td>


<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 6" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 6" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 7" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 7" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 8" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 8" height="130" width="200" /></a></div>
</td>


</tr>
<tr>


<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 9" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 9" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 10" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 10" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 11" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 11" height="130" width="200" /></a></div>
</td>

<td><div class="separator" style="clear: both; text-align: center;">
<a href="ENDEREÇO DO LINK 12" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ENDEREÇO DA IMAGEM 12" height="130" width="200" /></a></div>
</td>

</tr>
</tbody></table>