La verdad es que hace dos días que estoy con esto y no le encuentro la vuelta...
El problema es el siguiente, estoy haciendo una página para un cliente y hace mucho que no me pedían menú emergente, como el slice lo hago con Fireworks, usé su opción.
El problema es el siguiente: Como crea las capas con valor absoluto, no sé porque motivo (ya que con el posicionamiento css nunca me lleve bien), al minimizar la pantalla, el menú no cuadra... y obviamente, también depende de la resolución de cada pantalla. Conmigo se ve bien, pero en otras no.
La web en cuestión está acá: http://www.krakenhost.com.ar/soluna (el submenu está en productos)
La pregunta es esta:
1) Que mano le puedo hechar al css para que se solucione el problema? Pensé en pasarlo a una capa con posicionamiento relativo, el problema es que no sé muy bien como y los intentos que hice fueron en vano.
O la 2, quizás mas sencilla:
Hacer un nuevo sub menú sin usar CSS, aplicarlo solo a la tabla de Productos y no tener problemas de posicionamiento.. en ese caso, como lo hago? Estuve buscando tutoriales en internet, y problemas incluso en este mismo foro y no di con la respuesta.
En fin, cualquier ayuda es mas que bienvenida!
Feliz año para todos :D
PD: Les dejo el css asi no lo bajan:
Código:
body { background: url(img/imagen_r1_c1.png); background-repeat: repeat-x; font: 12px Verdana, Geneva, sans-serif; color: #000000; padding: 0; margin: 0; } a { color: #9C650B; text-decoration: underline; } a:hover { color: #9C650B; text-decoration: none; } .footext { color: #FFF; } a.foot { color: #FFF; text-decoration: none; } a.foot:hover { color: #FFF; text-decoration: underline; } a.footact { color: #FFF; text-decoration: underline; } a.footact:hover { color: #FFF; text-decoration: none; } td img { /* Another Mozilla/Netscape bug with making sure our images display correctly */ display: block; } #FWTableContainer57494128 { /* The master div to make sure that our popup menus get aligned correctly. Be careful when playing with this one. */ position:relative; margin:0px; width:1000px; height:850px; text-align:left; } #MMMenuContainer0015005435_0 { /* This ID is related to the master menu div for menu MMMenuContainer0015005435_0 and contains the important positioning information for the menu as a whole */ position:absolute; left:1033px; top:251px; visibility:hidden; z-index:300; } #MMMenu0015005435_0 { /* This class defines things about menu MMMenu0015005435_0's div. */ position:absolute; left:0px; top:0px; visibility:hidden; background-color:#d4d0c8; width:135px; height:110px; } .MMMIFVStyleMMMenu0015005435_0 { /* This class determines the general characteristics of the menu items in menu MMMenu0015005435_0 */ width:135px; height:22px; voice-family: "\"}\""; voice-family:inherit; width:131px; height:18px; } .MMMIVStyleMMMenu0015005435_0 { /* This class determines the general characteristics of the menu items in menu MMMenu0015005435_0 */ width:135px; height:22px; voice-family: "\"}\""; voice-family:inherit; width:131px; height:18px; } #MMMenu0015005435_0_Item_0 { /* Unique ID for item 0 of menu MMMenu0015005435_0 so we can set its position */ left:0px; top:0px; } #MMMenu0015005435_0_Item_1 { /* Unique ID for item 1 of menu MMMenu0015005435_0 so we can set its position */ left:0px; top:22px; } #MMMenu0015005435_0_Item_2 { /* Unique ID for item 2 of menu MMMenu0015005435_0 so we can set its position */ left:0px; top:44px; } #MMMenu0015005435_0_Item_3 { /* Unique ID for item 3 of menu MMMenu0015005435_0 so we can set its position */ left:0px; top:66px; } #MMMenu0015005435_0_Item_4 { /* Unique ID for item 4 of menu MMMenu0015005435_0 so we can set its position */ left:0px; top:88px; } #MMMenuContainer0015005435_0 img { /* needed for Mozilla/Camino/Netscape */ border:0px; } #MMMenuContainer0015005435_0 a { /* Controls the general apperance for menu MMMenuContainer0015005435_0's items, including color and font */ text-decoration:none; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:14px; color:#ffffff; text-align:left; vertical-align:middle; padding:2px; background: url("img/mmmenu1_135x22_up.gif") #cc9900; font-weight:normal; font-style:normal; display:block; position:absolute; } #MMMenuContainer0015005435_0 a:hover { /* Controls the mouse over effects for menu MMMenuContainer0015005435_0 */ color:#ffffff; background: url("img/mmmenu1_135x22_over.gif") #996600; }