problema con menu

[xfer2]

buenas. tengo un problema con un menu. quiero mostrar un borde de una imagen de un menu y no me muestra.

este es mi css.

Código:

#menu{
	background:url(../imagenes/menu.jpg) no repeat;
	width: 648px;
	height:40px;
	padding: 0;
	font-family:Tahoma;
	font-size:11px;
	font-weight:bold;
	color:#FFFFFF;
}

mi codigo html

Código HTML:

        <table width="648" border="0" cellpadding="0" cellspacing="0" id="menu">
          <tr>
            <td width="98" height="40">&nbsp;</td>
            <td width="2" height="40"><img src="imagenes/borde_menu.jpg" /></td>
            <td width="70" height="40"><div align="center">Inicio</div></td>
            <td width="2" height="40"><img src="imagenes/borde_menu.jpg" /></td>
            <td width="104" height="40"><div align="center">Quienes Somos</div></td>
            <td width="2" height="40"><img src="imagenes/borde_menu.jpg" /></td>
            <td width="77" height="40"><div align="center">Productos</div></td>
            <td width="2" height="40"><img src="imagenes/borde_menu.jpg" /></td>
            <td width="85" height="40"><div align="center">Mi cuenta</div></td>
            <td width="2" height="40"><img src="imagenes/borde_menu.jpg" /></td>
            <td width="103" height="40"><div align="center">Registrate Aqui</div></td>
            <td width="2" height="40"><img src="imagenes/borde_menu.jpg" /></td>
            <td width="111" height="40"><div align="center">Contactenos</div></td>
          </tr>
        </table> 

[cristian_cena]

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!

[AlbertoGarcia]

No entiendo, ¿quieres que la tabla que contiene el menu tenga borde o el borde está en la imagen?

Caso de que sea lo primero, el la etiqueta <table> tiene declarado el borde como 0. Caso de que sea lo segundo, está mal redactada la regla, el 'no repeat' lo tines sin guión y puede que te invalide la regla:

Código css:

#menu {
    background:url(../imagenes/menu.jpg) no-repeat;
    width: 648px;
    height:40px;
    padding: 0;
    font-family:Tahoma;
    font-size:11px;
    font-weight:bold;
    color:#FFFFFF;
}
 

Salud!

[xfer2]

gracias por responder. bueno si recien estoy maquetando una web con tablas. debo migrar mi web con css.

y viendo de mi estilo, era la segunda opcion que decias. si estaba mal declarada la regla no-repeat. gracias por la aclaracion.

sera por que utilizo el adobe DW cs3 ?.

gracias y saludos.

[cristian_cena]

xfer2, he testeado la manera en que dw cs3 crea los estilos y no tube problemas. DW, en cambio, no es bueno en modo diseño. Pero si lo que quieres es trabajar en modo codigo te será muy util ya que este programa facilita y agiliza la escritura. Aunque si prefieres algun editor gratuito puedes usar este http://www.taringa.net/posts/downloa...tor-SciTE.html. Lo uso actualmente y me parece bueno.
Existe otro editor llamado notepad++, puedes buscarlo en google y bajartelo, ya que tambien es gratuito.

[jomaruro]

Hola:

Para añadir algo más a lo que te ha indicado cristian_cena, te aconsejo que te des una vuelta por las FAQ de CSS, donde encontrarás unos cuantos ejemplos de como se hacen menús en CSS.

Saludos.