初心者です。floatでレイアウトしてるのですが、縦線とテーブルの間を広げる方法がわかりません

質問

floatでレイアウトしてるのですが、縦線とテーブルの間を広げる方法がわかりません
メニューとコンテンツが縦線で区切られてるのですが右側のテーブルと縦線が合体してしまいます。
縦線とテーブルの間に少し隙間を作りたいのですが、どうすればいいでしょうか？
HTMLとCSSを書いておきます。よろしくお願いします。

・HTML
<div id="contents">
<table>
<tr>
<td>×</td><td><p>あああ</p>
</tr>
<tr>
<td>○</td><td><p>いいい</p>
</tr>
<tr>
<td>■</td><td><p>ううう</p>
</tr>
</table>
<br><br>
a
</div>

<div id="left-menu">
<ul>
<li><a href="index.html" class="a8">メニュー</a></li>
<li><a href="league.html" class="a8">メニュー</a></li>
</ul>
</div>

<div id="footer">
ああああああ
</div>

・CSS
body { width: 900px; }
#contents { float: right; width: 740px; border-left: 1px solid #999;}
#left-menu { float: left; width: 150px;}
#footer { clear: both; }

回答No.1

salonpath

#contents に
padding-left:5px;
かな

<td>が閉じてないみたいですよ