Veran, navegando por la red encontré un website en el que el menú principal no se movia al desplazar la barra de scroll. Hasta aquí nada extraño prodría perfectamente estar hecho con marcos, pero me fijé en el fondo cuando cambiaba el tamaño de la página y me di cuanta de que no usaba marcos.
Así que copié el código fuente de la página y extrage la parte que permitía tal efecto,
que adapte para poder hacer pruebas:
Código :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Documento sin título</title> <style type="text/css"> <!-- #navcontainer { margin: 0; padding: 0; height: 319px; width: 190px; position:absolute; display:inline; top: 150px; margin-right:20px; left:0; float:left; } #navcontainer ul li { list-style-type: none; padding: 0; margin: 0; display: block; } #navcontainer #navlist { padding: 0; margin: 0; float:left; } @media screen { div#navcontainer {position: fixed;} * html {overflow-y: hidden;} * html body {overflow-y: auto;height: 100%;padding: 0;} * html div#navcontainer {position: absolute;} } #contenedor { margin: 0; padding: 0; display:block; height: auto; width: 810px; } #contenido { float:right; width: 600px; height:auto; margin:0; padding:0; } --> </style> </head> <body> <div id="contenedor"> <div id="navcontainer"> <ul id="navlist"> <li><a href=" " target="_self">Opción</a></li> <li><a href=" " target="_self">Opción</a></li> <li><a href=" " target="_self">Opción</a></li> <li><a href=" " target="_self">Opción</a></li> <li><a href=" " target="_self">Opción</a></li> <li><a href=" " target="_self">Opción------------------</a></li> <li><a href=" " target="_self">Opción</a></li> <li><a href=" " target="_self">Opción</a></li> <li><a href=" " target="_self">Opción</a></li> <li><a href=" " target="_self">Opción</a></li> </ul> </div> <div id="contenido"> <table width="100" height="1479" border="3" cellpadding="0" cellspacing="0" bordercolor="#FF0000"> <tr> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> </table> </div> </div> </body> </html>
El problema es que no entiendo como hace el CSS que el menú se quede quieto, no tengo tanto conociemeinto de CSS y me gustaría que alguien me lo pudiera explicar.http://www.freewebs.com/ryuz/Fijo.htm