Así es más o menos como lo estoy haciendo.
Creo que no me estoy explicando correctamente:
El menú flotante es una capa contenida en el "contenedor" y quiero que tenga un comportamiento independiente del "contenedor"
Menu flotante: Su ancho varía entre 1280px y 800px
Contenedor: Su ancho varía entre 1280px y 1024px
El menú flotante debe ocupar el 100% del ancho visible del navegador, siempre y cuando éste no sea menor que 800px. Sin embargo la capa "contenedor" debe ocupar el 100% del ancho visible del navegador siempre y cuando no sea menor que 1024px.
El código CSS del contenedor:
Código:
#contenedor {
max-width:1280px; /* Si ancho_pantalla > 1280px, limito los contenidos a 1280px */
min-width:1024px; /* Si ancho_pantalla < 1024px, limito los contenidos a 1024px */
min-height: 100%; /* Necesario para sticky footer */
margin: 0 auto -37px; /* -37px. Necesario para sticky footer */
}
Y el de la barra flotante superior:
Código:
#encabezado
{
height: 41px;
position: fixed; /* Para que la barra superior flote sobre los contenidos*/
top: 0;
left: 0;
right: 0;
min-width: 800px;
}
Y la ubicación de las capas en el HTML
Código:
<body>
<div id="contenedor">
<div id="encabezado">
</div>
</div>
</body>
Un saludo