Foros del Web » Creando para Internet » CSS »

URGENTE: Otro problema con el MENU Desplegable

 Estas en el tema de URGENTE: Otro problema con el MENU Desplegable en el foro de CSS en Foros del Web. Hola bueno para mi es Urgente para los que se preguntan que si es realmente Urgente , ahora lo que pasa es que en Firefox ...
  #1 (permalink)  
Antiguo 16/06/2010, 00:20
 
Fecha de Ingreso: enero-2010
Mensajes: 113
Antigüedad: 14 años, 2 meses
Puntos: 2
Exclamación URGENTE: Otro problema con el MENU Desplegable
Hola bueno para mi es Urgente para los que se preguntan que si es realmente Urgente , ahora lo que pasa es que en Firefox todo sale bien pero al entrar a IE me di cuenta que las tablas que tienen el contenido no salen :S el codigo es este:


Código HTML: 
Ver original
  1. <body><div id="Menu">
  2. <div id="ContenedorMenu">
  3. <div id="Television"><a href="#" onMouseover="getElementById('ContenidoTe').style.display = 'block';
  4. getElementById('ContenidoDe').style.display = 'none';
  5. getElementById('ContenidoIn').style.display = 'none';
  6. getElementById('ContenidoVa').style.display = 'none';
  7. getElementById('ContenidoPe').style.display = 'none';
  8. getElementById('ContenidoSe').style.display = 'none';
  9. getElementById('ContenidoEm').style.display = 'none';"></a></div>
  10. <div id="Deportes"><a href="#" onMouseover="getElementById('ContenidoDe').style.display = 'block';
  11. getElementById('ContenidoTe').style.display = 'none';
  12. getElementById('ContenidoIn').style.display = 'none';
  13. getElementById('ContenidoVa').style.display = 'none';
  14. getElementById('ContenidoPe').style.display = 'none';
  15. getElementById('ContenidoSe').style.display = 'none';
  16. getElementById('ContenidoEm').style.display = 'none';"></a></div>
  17. <div id="Infantiles"><a href="#" onMouseover="getElementById('ContenidoIn').style.display = 'block';
  18. getElementById('ContenidoTe').style.display = 'none';
  19. getElementById('ContenidoDe').style.display = 'none';
  20. getElementById('ContenidoVa').style.display = 'none';
  21. getElementById('ContenidoPe').style.display = 'none';
  22. getElementById('ContenidoSe').style.display = 'none';
  23. getElementById('ContenidoEm').style.display = 'none';"></a></div>
  24. <div id="Variados"><a href="#" onMouseover="getElementById('ContenidoVa').style.display = 'block';
  25. getElementById('ContenidoTe').style.display = 'none';
  26. getElementById('ContenidoIn').style.display = 'none';
  27. getElementById('ContenidoDe').style.display = 'none';
  28. getElementById('ContenidoPe').style.display = 'none';
  29. getElementById('ContenidoSe').style.display = 'none';
  30. getElementById('ContenidoEm').style.display = 'none';"></a></div>
  31. <div id="Peliculas"><a href="#" onMouseover="getElementById('ContenidoPe').style.display = 'block';
  32. getElementById('ContenidoTe').style.display = 'none';
  33. getElementById('ContenidoIn').style.display = 'none';
  34. getElementById('ContenidoVa').style.display = 'none';
  35. getElementById('ContenidoDe').style.display = 'none';
  36. getElementById('ContenidoSe').style.display = 'none';
  37. getElementById('ContenidoEm').style.display = 'none';"></a></div>
  38. <div id="Series"><a href="#" onMouseover="getElementById('ContenidoSe').style.display = 'block';
  39. getElementById('ContenidoTe').style.display = 'none';
  40. getElementById('ContenidoIn').style.display = 'none';
  41. getElementById('ContenidoVa').style.display = 'none';
  42. getElementById('ContenidoDe').style.display = 'none';
  43. getElementById('ContenidoPe').style.display = 'none';
  44. getElementById('ContenidoEm').style.display = 'none';"></a></div>
  45. <div id="Emisoras"><a href="#" onMouseover="getElementById('ContenidoEm').style.display = 'block';
  46. getElementById('ContenidoTe').style.display = 'none';
  47. getElementById('ContenidoIn').style.display = 'none';
  48. getElementById('ContenidoVa').style.display = 'none';
  49. getElementById('ContenidoDe').style.display = 'none';
  50. getElementById('ContenidoSe').style.display = 'none';
  51. getElementById('ContenidoPe').style.display = 'none';"></a></div>
  52. </div>
  53. <div id="ContenidoTe" onMouseOut="getElementById('ContenidoTe').style.display = 'none';">
  54. <div class="Organizado" onMouseover="getElementById('ContenidoTe').style.display = 'block';">
  55. <table>
  56. <tr>
  57. <td><div class="Canalito" ><a href="">Canal Caracol<img id="Imgcanalito" border="0" src="img/flecha.png"></a></div></td>
  58. </tr>
  59.  
  60. </table>
  61. </div>
  62. </div>

Nota: le quite las etiquetas doctype head etc porque me decia que el mensaje era muy largo
  #2 (permalink)  
Antiguo 16/06/2010, 00:20
 
Fecha de Ingreso: enero-2010
Mensajes: 113
Antigüedad: 14 años, 2 meses
Puntos: 2
Respuesta: URGENTE: Otro problema con el MENU Desplegable
y el Css es este:

Código CSS: 
Ver original
  1. #Menu {
  2.     position: relative;
  3.     width: 1002px;
  4.     height: 40px;
  5.     list-style:none;
  6.     left: 50&#37;;
  7.     margin-left: -501px;
  8.     }
  9. #Television a{
  10.     background-image:url('../img/menu.png');
  11.     display: block;
  12.     float: left; 
  13.     width: 175px;
  14.     height: 40px;
  15.     }
  16. #Deportes a{
  17.     background-image:url('../img/menu.png');
  18.     background-position: -178px 0px;
  19.     display: block;
  20.     float: left; 
  21.     width: 105px;
  22.     height: 40px;
  23.     }
  24. #Infantiles a{
  25.     background-image:url('../img/menu.png');
  26.     background-position: -283px 0px;
  27.     display: block;
  28.     float: left; 
  29.     width: 199px;
  30.     height: 40px;
  31.     }
  32. #Variados a{
  33.     background-image:url('../img/menu.png');
  34.     background-position: -482px 0px;
  35.     display: block;
  36.     float: left; 
  37.     width: 100px;
  38.     height: 40px;
  39.     }
  40. #Peliculas a{
  41.     background-image:url('../img/menu.png');
  42.     background-position: -582px 0px;
  43.     display: block;
  44.     float: left; 
  45.     width: 95px;
  46.     height: 40px;
  47.     }
  48. #Series a{
  49.     background-image:url('../img/menu.png');
  50.     background-position: -677px 0px;
  51.     display: block;
  52.     float: left; 
  53.     width: 153px;
  54.     height: 40px;
  55.     }
  56. #Emisoras a{
  57.     background-image:url('../img/menu.png');
  58.     background-position: -830px 0px;
  59.     display: block;
  60.     float: left; 
  61.     width: 172px;
  62.     height: 40px;
  63.     }
  64. #Television a:hover{
  65.     background-image:url('../img/menu.png');
  66.     background-position: 0px -41.5px;
  67.     display: block;
  68.     float: left; 
  69.     width: 175px;
  70.     height: 40px;
  71.     }
  72. #Deportes a:hover{
  73.     background-image:url('../img/menu.png');
  74.     background-position: -178px -41.5px;
  75.     display: block;
  76.     float: left; 
  77.     width: 105px;
  78.     height: 40px;
  79.     }
  80. #Infantiles a:hover{
  81.     background-image:url('../img/menu.png');
  82.     background-position: -283px -41.5px;
  83.     display: block;
  84.     float: left; 
  85.     width: 199px;
  86.     height: 40px;
  87.     }
  88. #Variados a:hover{
  89.     background-image:url('../img/menu.png');
  90.     background-position: -482px -41.5px;
  91.     display: block;
  92.     float: left; 
  93.     width: 100px;
  94.     height: 40px;
  95.     }
  96. #Peliculas a:hover{
  97.     background-image:url('../img/menu.png');
  98.     background-position: -582px -41.5px;
  99.     display: block;
  100.     float: left; 
  101.     width: 95px;
  102.     height: 40px;
  103.     }
  104. #Series a:hover{
  105.     background-image:url('../img/menu.png');
  106.     background-position: -677px -41.5px;
  107.     display: block;
  108.     float: left; 
  109.     width: 153px;
  110.     height: 40px;
  111.     }
  112. #Emisoras a:hover{
  113.     background-image:url('../img/menu.png');
  114.     background-position: -830px -41.5px;
  115.     display: block;
  116.     float: left; 
  117.     width: 172px;
  118.     height: 40px;
  119.     }
  120. #ContenidoTe {
  121.     position: relative;
  122.     width: 500px;
  123.     height: auto;
  124.     left: 5px;
  125.     top: 38px;
  126.     background: url("../img/fondomenu.png");
  127.     display: none;
  128.     border-radius-bottom-right: 10px;
  129.     border-radius-bottom-left: 10px;
  130.     -webkit-border-radius-bottom-right: 10px;
  131.     -webkit-border-radius-bottom-left: 10px;
  132.     -moz-border-radius-bottomright: 10px;
  133.     -moz-border-radius-bottomleft: 10px;
  134.     border: 1px solid #000;
  135.     border-top: 0px;
  136.     z-index: 1;
  137.     }
  138. #ContenidoDe {
  139.     position: relative;
  140.     width: 500px;
  141.     height: auto;
  142.     top: 38px;
  143.     background: url("../img/fondomenu.png");
  144.     left: 120px;
  145.     display: none;
  146.     border-radius-bottom-right: 10px;
  147.     border-radius-bottom-left: 10px;
  148.     -webkit-border-radius-bottom-right: 10px;
  149.     -webkit-border-radius-bottom-left: 10px;
  150.     -moz-border-radius-bottomright: 10px;
  151.     -moz-border-radius-bottomleft: 10px;
  152.     border: 1px solid #000;
  153.     border-top: 0px;
  154.     z-index: 1;
  155.     }
  156. #ContenidoIn {
  157.     position: relative;
  158.     width: 500px;
  159.     height: auto;
  160.     top: 38px;
  161.     background: url("../img/fondomenu.png");
  162.     left: 220px;
  163.     display: none;
  164.     border-radius-bottom-right: 10px;
  165.     border-radius-bottom-left: 10px;
  166.     -webkit-border-radius-bottom-right: 10px;
  167.     -webkit-border-radius-bottom-left: 10px;
  168.     -moz-border-radius-bottomright: 10px;
  169.     -moz-border-radius-bottomleft: 10px;
  170.     border: 1px solid #000;
  171.     border-top: 0px;
  172.     z-index: 1;
  173.     }
  174. #ContenidoVa {
  175.     position: relative;
  176.     width: 500px;
  177.     height: auto;
  178.     top: 38px;
  179.     background: url("../img/fondomenu.png");
  180.     left: 320px;
  181.     display: none;
  182.     border-radius-bottom-right: 10px;
  183.     border-radius-bottom-left: 10px;
  184.     -webkit-border-radius-bottom-right: 10px;
  185.     -webkit-border-radius-bottom-left: 10px;
  186.     -moz-border-radius-bottomright: 10px;
  187.     -moz-border-radius-bottomleft: 10px;
  188.     border: 1px solid #000;
  189.     border-top: 0px;
  190.     z-index: 1;
  191.     }
  192. #ContenidoPe {
  193.     position: relative;
  194.     width: 500px;
  195.     height: auto;
  196.     top: 38px;
  197.     background: url("../img/fondomenu.png");
  198.     left: 420px;
  199.     display: none;
  200.     border-radius-bottom-right: 10px;
  201.     border-radius-bottom-left: 10px;
  202.     -webkit-border-radius-bottom-right: 10px;
  203.     -webkit-border-radius-bottom-left: 10px;
  204.     -moz-border-radius-bottomright: 10px;
  205.     -moz-border-radius-bottomleft: 10px;
  206.     border: 1px solid #000;
  207.     border-top: 0px;
  208.     z-index: 1;
  209.     }
  210. #ContenidoSe {
  211.     position: relative;
  212.     width: 500px;
  213.     height: auto;
  214.     top: 38px;
  215.     background: url("../img/fondomenu.png");
  216.     left: 480px;
  217.     display: none;
  218.     border-radius-bottom-right: 10px;
  219.     border-radius-bottom-left: 10px;
  220.     -webkit-border-radius-bottom-right: 10px;
  221.     -webkit-border-radius-bottom-left: 10px;
  222.     -moz-border-radius-bottomright: 10px;
  223.     -moz-border-radius-bottomleft: 10px;
  224.     border: 1px solid #000;
  225.     border-top: 0px;
  226.     z-index: 1;
  227.     }
  228. #ContenidoEm {
  229.     position: relative;
  230.     width: 500px;
  231.     height: auto;
  232.     top: 38px;
  233.     background: url("../img/fondomenu.png");
  234.     left: 490px;
  235.     display: none;
  236.     border-radius-bottom-right: 10px;
  237.     border-radius-bottom-left: 10px;
  238.     -webkit-border-radius-bottom-right: 10px;
  239.     -webkit-border-radius-bottom-left: 10px;
  240.     -moz-border-radius-bottomright: 10px;
  241.     -moz-border-radius-bottomleft: 10px;
  242.     border: 1px solid #000;
  243.     border-top: 0px;
  244.     z-index: 1;
  245.     }
  246. .Organizado {
  247.     position: relative;
  248.     width: 500px;
  249.     left: -1000px;
  250.     }
  251. .Canalito {
  252.     font-weight: bold;
  253.     font-size: 12px;
  254.     text-align: left;
  255.     width: 100px;
  256.     margin: 10px;
  257.     }
  258. .Canalito:hover {
  259.     font-weight: bold;
  260.     font-size: 12px;
  261.     text-align: left;
  262.     width: 100px;
  263.     margin: 10px;
  264.     text-decoration: none;
  265.     border: 0px;
  266.     color: #000;
  267.     }
  268. .Canalito a:link {
  269.     text-decoration: none;
  270.     border: 0px;
  271.     color: #000;
  272.     }
  273. .Canalito a:visited {
  274.     text-decoration: none;
  275.     border: 0px;
  276.     color: #000;
  277.     }
  278. .Canalito a:active {
  279.     text-decoration: none;
  280.     border: 0px;
  281.     color: #000;
  282.     
  283.     }
  284. #Imgcanalito {
  285.     position: relative;
  286.     top: 2px;
  287.     float: right;
  288.     }

Screen del problema para los que son visuales:

Firefox




IE:



Espero puedan ayudarme,
Gracias.
Última edición por canino_latino; 16/06/2010 a las 05:29
  #3 (permalink)  
Antiguo 16/06/2010, 05:30
 
Fecha de Ingreso: enero-2010
Mensajes: 113
Antigüedad: 14 años, 2 meses
Puntos: 2
Respuesta: URGENTE: Otro problema con el MENU Desplegable
Alguien que me ayude ?

Etiquetas: desplegable
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


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 05:36.