Foros del Web » Creando para Internet » CSS »

problema con menu

Estas en el tema de problema con menu en el foro de CSS en Foros del Web. 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. ...
  #1 (permalink)  
Antiguo 26/10/2009, 17:13
(Desactivado)
 
Fecha de Ingreso: junio-2009
Mensajes: 256
Antigüedad: 8 años, 6 meses
Puntos: 1
problema con menu

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> 
  #2 (permalink)  
Antiguo 26/10/2009, 17:53
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: problema con menu

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!

Última edición por cristian_cena; 26/10/2009 a las 17:58
  #3 (permalink)  
Antiguo 26/10/2009, 17:55
 
Fecha de Ingreso: mayo-2009
Ubicación: Fuerteventura
Mensajes: 324
Antigüedad: 8 años, 7 meses
Puntos: 19
Respuesta: problema con menu

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:
Ver original
  1. #menu {
  2.     background:url(../imagenes/menu.jpg) no-repeat;
  3.     width: 648px;
  4.     height:40px;
  5.     padding: 0;
  6.     font-family:Tahoma;
  7.     font-size:11px;
  8.     font-weight:bold;
  9.     color:#FFFFFF;
  10. }

Salud!
  #4 (permalink)  
Antiguo 26/10/2009, 18:29
(Desactivado)
 
Fecha de Ingreso: junio-2009
Mensajes: 256
Antigüedad: 8 años, 6 meses
Puntos: 1
Respuesta: problema con menu

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.

Última edición por xfer2; 26/10/2009 a las 18:38 Razón: correcion del texto.
  #5 (permalink)  
Antiguo 26/10/2009, 21:26
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: problema con menu

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.
  #6 (permalink)  
Antiguo 27/10/2009, 16:17
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: problema con menu

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.

Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:31.