Hi! I have a table with a drop-down menus, the problem is that the table has scroll, and the menu is not visible when it is the end, it gets below the table. I put the code for them if I can help. Thanks! CSS .menu5 {text-align:left; font-family: arial, sans-serif; position:relative; font-size:11px; vertical-align:middle;width:120px; list-style-type:none; margin:0; padding:0;float:left; height:25px;} .menu5 ul { padding:0; margin:0; list-style-type:none; /* for Firefox */ } .menu5 li { float:left; position:relative; } .menu5 li a, .menu5 li a:visited { display:block; text-decoration:none; float:left; color:#02458f; } .menu5 li ul { visibility:hidden; position:absolute; left:0; height:0; overflow:hidden; } .menu5 table { margin:-10px; border-collapse:collapse; font-size:1em; /* font size for IE5.5 */ } /* fist line style for IE7 and non-IE browsers and the second line for IE5.5 and IE6 */ .menu5 li:hover a, .menu5 li a:hover { text-decoration:none; margin-left:15px; } .menu5 li:hover ul, .menu5 li a:hover ul { visibility:visible; background:#fff; border-left:2px solid #98D1EA; border-right:2px solid #98D1EA; border-bottom:1px solid #98D1EA; left:0; top:1.7em; overflow:visible; border-top:1px solid #98D1EA; } .menu5 li:hover ul li a, .menu5 li a:hover ul li a { display:block; font-weight:normal; background:transparent; text-decoration:none; height:auto; border-bottom:1px solid #98D1EA; vertical-align:middle; } * html .menu5 li a:hover ul li a { width:10em; w\idth:9em; /* hack for IE5.5 */ } .menu5 li:hover ul li a:hover, .menu5 li a:hover ul li a:hover { text-decoration:none; color:#fff; background:#98D1EA;padding:0px; margin:0px; border-top:0px; border-right:0px; border-left:0px; border-bottom:1px solid #98D1EA; } .scroll{ overflow: scroll; overflow-x: hidden; height:100px; width:100%; position:relative; z-index:999999999; } #imgModificar{ background-image:url(ataa_es_web_pub/images/editar.gif); background-repeat:no-repeat; background-position: 5px; height:21px; padding-left:25px; padding-top:4px; width:80px; } #imgConsultar{ background-image:url(ataa_es_web_pub/images/consultar.gif); background-repeat:no-repeat; background-position: 5px; height:21px; padding-left:25px; padding-top:4px;width:80px; } #imgEliminar{ background-image:url(ataa_es_web_pub/images/eliminar.gif); background-repeat:no-repeat; background-position: 5px; height:21px; padding-left:25px; padding-top:4px;width:80px; } #imgAcciones{ background-image:url(ataa_es_web_pub/images/menuacciones.gif); background-repeat:no-repeat; background-position: 59px 7px; vertical-align:middle; padding-bottom:7px; width:72px; height:11px; padding-left:3px; padding-top:3px; margin-left:15px; } #imgAcciones:hover{ background-image:url(ataa_es_web_pub/images/menuacciones.gif); background-repeat:no-repeat; background-position: 59px 7px; vertical-align:middle; padding-bottom:7px; width:72px; height:11px; padding-left:3px; padding-top:3px; margin-left:15px; border-top:2px solid #98D1EA; border-left:2px solid #98D1EA; border-right:2px solid #98D1EA; border-bottom: 1px solid #fff; } Code (markup): HTML <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Tabla menú</title> </head> <link rel="stylesheet" media="all" type="text/css" href="menu5.css" /> <body> <div class="scroll"> <table width="100%" border="0" cellspacing="0" cellpadding="0" class="TablaContenidoCaja" style="z-index:999999999px;"> <tr class="Pijama1" id="obj1"> <td width="20%" class="TextoTablaIzq"><span id="codReg0">XXXXXXXXX</span></td> <td width="68%" class="TextoTablaIzq"><span id="desc0">XXXX</span></td> <td class="TextoTablaCen"> <ul class="menu5" style=" z-index:99999999;"> <li> <a href="#" id="imgAcciones">Acciones <table><tr><td> <ul> <li><a href="#" title="Modificar" id="imgModificar">Modificar</a></li> <li><a href="#" title="Consultar" id="imgConsultar">Consultar</a></li> <li><a href="#" title="Eliminar" id="imgEliminar">Eliminar</a></li> </ul> </td></tr></table></a> </li> </ul> </td> </tr> <tr class="Pijama2" id="obj1"> <td width="20%" class="TextoTablaIzq"><span id="codReg1">XXXXXXXXX</span></td> <td width="68%" class="TextoTablaIzq"><span id="desc1">XXXX</span></td> <td class="TextoTablaCen"> <ul class="menu5" style=" z-index:99999998;"> <li> <a href="#" id="imgAcciones">Acciones <table><tr><td> <ul> <li><a href="#" title="Modificar" id="imgModificar">Modificar</a></li> <li><a href="#" title="Consultar" id="imgConsultar">Consultar</a></li> <li><a href="#" title="Eliminar" id="imgEliminar">Eliminar</a></li> </ul> </td></tr></table></a> </li> </ul> </td> </tr> <tr class="Pijama1" id="obj1"> <td width="20%" class="TextoTablaIzq"><span id="codReg0">XXXXXXXXX</span></td> <td width="68%" class="TextoTablaIzq"><span id="desc0">XXXX</span></td> <td class="TextoTablaCen"> <ul class="menu5" style=" z-index:99999997;"> <li> <a href="#" id="imgAcciones">Acciones <table><tr><td> <ul> <li><a href="#" title="Modificar" id="imgModificar">Modificar</a></li> <li><a href="#" title="Consultar" id="imgConsultar">Consultar</a></li> <li><a href="#" title="Eliminar" id="imgEliminar">Eliminar</a></li> </ul> </td></tr></table></a> </li> </ul> </td> </tr> <tr class="Pijama2" id="obj1"> <td width="20%" class="TextoTablaIzq"><span id="codReg1">XXXXXXXXX</span></td> <td width="68%" class="TextoTablaIzq"> <span id="desc1">XXXX</span> </td> <td class="TextoTablaCen"> <ul class="menu5" style=" z-index:99999996;"> <li> <a href="#" id="imgAcciones">Acciones <table><tr><td> <ul> <li><a href="#" title="Modificar" id="imgModificar">Modificar</a></li> <li><a href="#" title="Consultar" id="imgConsultar">Consultar</a></li> <li><a href="#" title="Eliminar" id="imgEliminar">Eliminar</a></li> </ul> </td></tr></table></a> </li> </ul> </td> </tr> </table></div> </body> </html> Code (markup):
Is there a working version of this somewhere we can look at? I really can't tell what you're trying to do, why you are scrolling something that drops down? Or why a drop-down is in a table?? I do assume you have a good reason to do so, but I just can't see how it's supposed to look or act.
Hi, I'm sorry, but I can not show them a version on the Internet, because it is not yet in production. Working for a bank, and the table and menus asking me to make them well .. but I don't know what else to do. Thank you. Lucy
But whatever these people want, they must have seen it somewhere, or they wouldn't know what they wanted, right? Some other bank might have this thing?