いつもお世話になっております。
下記、横5列の画像を並べた上に大きな画像のバナーを貼ってますが
上部のバナーと下記横並びの画像の間が大きく開いてしまいます。
何が原因でしょうか？


<table>
<tr>
<td>
<a href=""><img src=""width="100%"></a>
</td>
</tr>
</table>

<table>
<!--1行目-->
<tr>
<td>
<a href=""><img src=""></a>
</td>
<td>
<a href=""><img src=""></a>
</td>
<td>
<a href=""><img src=""></a>
</td>
<td>
<a href=""><img src=""></a>
</td>
<td>
<a href=""><img src=""></a>
</td>
</tr>
<br>
<br>
</table>



それと、下記タグで表を作成しておりますが
スマホで見たときに端が切れてます。
どうすれば端が切れず収まりますか？
(タグに詳しくなくどこからか引っ張ってきたタグをそのまま使用してました。)


<table width="640" border="0" cellpadding="10" cellspacing="1" bgcolor="silver">
<tr><td bgcolor="#F3EAD4" width="40">●名</td><td bgcolor="ffffff" width="100%">
<font size="2" color="#000000">
● <br>

<br>

</font>
</td></tr>
<tr><td bgcolor="#F3EAD4" width="40">●<br></td><td bgcolor="#ffffff">
<font size="2" color="#000000"><br>
●<br>

</font>
</td></tr>
</table>



すみませんがよろしくお願いいたします。