Hola xfer2, como no veo la imagen que utilizas no visualizo bien el problema. A lo mejor una URL puede venirnos bien. De todos modos ahi van unas pequeñas observaciones.
Te sugiero que utilizes: Código HTML:
<ul>
<li></li>
<li></li>
...
<li></li>
</ul>
en vez de: Código HTML:
<table>
<tr>
<td></td>
<td></td>
...
<td></td>
</tr>
</table> ... Luego, ya una vez que tengas la lista no ordenada: incluye clases y/o id's
Código HTML:
<li class="mi_clase"></li> que llamas en <style> --> .mi_clase {}
<li id="mi_id"></li> que llamas en <style> --> #mi_id {}
... Luego: Da los anchos, altos y todo los estilos que quieras dentro de la hoja de estilos y no en las mismas etiquetas html (ej:esto ensucia tu codigo: <td width="70" height="40"> )
Te quedaria algo así, por ejemplo:
Código HTML:
.mi_clase {width:98px; height:40px;} /*Da tantas clases y/o id's como necesites, recuerda que las id deben ser unicas en un documento, mientras que las clases pueden repetirse*/
... Luego incluye tus imagenes en los estilos: (veo que las incluyes tambien en el body y no es una buena práctica hacerlo)
Código HTML:
.mi_clase {
width:98px;
height:40px;
background-image:url(../imagenes/menu.jpg) no repeat;
}
supongo que el borde que quieres incluir esta en la misma imagen, sino utiliza la propìedad "border" y si este borde deseas que sea redondeado utiliza la propiedad "border-radius"
Veo que tu maqueta esta echa con tablas, podrias migrar con este link de mikmoro:
http://www.araudi.net/migracion/migr...sin_dolor.html
A su vez sería interesante que te informes sobre la "caja css"
http://www.librosweb.es/css/capitulo4.html y luego aprendas a utilizar la propiedad "position"
Nos vemos, un saludo!