tengo problemas con estilos en las tablas tengo dos tablas
y a la segunda le quiero poner el fondo pero se pone en la primera tabla
primera tabla:
<html>
<style>
body{
background:url(carp/fund.png);
}
</style>
<body>
<tr><td>
<title>mi page</title>
<body>
<table align="center" bordercolor="" width="90%" height="10%" cellpadding="1" cellspacing="1" >
<tr>
<td><table align="left"><a href="index.php" ><img src="carp/.png" ></a></table></td><td background="carp/fond.jpg"><table width="90%" align="center" ><font><h2 align="center"><a href="" color="black"> iozk </a></h2></font><font><h4 align="center"> iozk connection</h4></font> </table></td><td><table width="1%"><a href=""><img src="carp/.png" align="right"></a></table></td>
</tr>
</table>
</body>
</td></tr>
</html>
segunda tabla(menu):
<html>
<head>
<link href="estile.css" rel="stylesheet" type="text/css" />
</head>
<tr><td>
<body>
<table width="90%" border="" align="center" cellpadding="1" cellspacing="0" bgcolor="black" >
<tr><div id="menu">
<ul>
<li class="nivel1 primera"><a href="#" class="nivel1">inicio</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 1<table class="falsa"><tr><td><![endif]-->
<ul>
<li class="primera"><a href="#">Opción 1.1</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="#" class="nivel1">foro</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 2<table class="falsa"><tr><td><![endif]-->
<ul>
<li class="primera"><a href="#">Opción 2.1</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="#" class="nivel1">galeria</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 3<table class="falsa"><tr><td><![endif]-->
<ul>
<li class="primera"><a href="#">Opción 3.1</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="#" class="nivel1">conectar</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 4<table class="falsa"><tr><td><![endif]-->
<ul>
<li class="primera"><a href="#">Opción 4.1</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="#" class="nivel1">Opción 5</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 5<table class="falsa"><tr><td><![endif]-->
<ul>
<li class="primera"><a href="#">Opción 5.1</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>
</tr>
</table>
</body>
</td></tr>
</html>
el css:
<style type="text/css">
* { margin: 2px;
padding: 0px; outline:none;
}
html, body { width: 100%; }
body { background-image:url(carp/verd.png);
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#menu { text-align: center;
font-size: 0.7em;
width: 875px;
margin: 1px auto;
}
#menu ul { list-style-type: none;}
#menu ul li.nivel1 { float: left;
width: 110px;
margin-right: 3px;
}
#menu ul li a {display: block;
text-decoration: none;
color: black;
background-image: url(carp/botf2.png);
border: solid 0px #fff;
padding: 2.7px;
position: relative;
}
#menu ul li:hover {position: relative;
}
#menu ul li a:hover, #menu ul li:hover a.nivel1 {background-image:url(carp/botfo.png);
color: #000;
position: relative;
}
#menu ul li a.nivel1 {display: block!important;display: none;
position: relative;
}
#menu ul li ul {display: none;
}
#menu ul li a:hover ul, #menu ul li:hover ul {display: block;
position: absolute;right: 0px;
}
#menu ul li ul li a {width: 110px;
padding: 2.7px 0px;
border-top-color: #000;
}
#menu ul li ul li a:hover {border-top-color: #000;
position: relative;
}
table.falsa {border-collapse:collapse;
border:0px;
float: left;
position: relative;
}
</style>
ayudap