I'm using CSS and tables to make navigation for a layout. I saw this cool effect where a background image appeared under the header cell. I figured out how to do that fine... problem is that the image repeats and I can't for the life of my figure out why...

This is my CSS code for the table stuff:
p {
font: 12px Times New Roman; color: #750420}

#topnav {
border: 1px solid #750420; background-image: url(nav.jpg); height: 20px; width: 150px; text-align: center;}

#nav {
background-color: #EEB4C6; width: 150; border: solid #750420; border-width: 0px 1px 1px 1px;}

#table {
border: 1px solid #750420; background-color: #EEB4C6;}

And here is the table stuff:
<table id="table">
<tr><td>
<table id="topnav">
<tr><td><b><p>HEADER</b></td></tr></table>

<table id="nav" align="center">
<tr><td>
<p>
[+] <a href="LINK HERE">LINK TITLE</a><br>
[+] <a href="LINK HERE">LINK TITLE</a><br>
[+] <a href="LINK HERE">LINK TITLE</a><br>
</tr></td></table>
</tr></td></table>

It ends up looking like this...

show image (http://img12.imageshack.us/img12/4857/demo4kk.jpg)

See how it duplicates? I can't figure out how to fix it... thanks for the help~

K-kun

background-repeat: none;
Add that to the section in your CSS for the cell with the background