Fijar «Header Bottom» en versión ordenador
-
Buenas tardes,
me gustaría fijar el «Header Bottom» en versión ordenador para que cuando el cliente baje por mi página el menú se mantenga en la parte superior.
¿Hay alguna forma de añadir en la parte de CSS adicional algín código para que esto funcione?Nota: Solo quiero que pase en la versión ordenador. Las versiones tablet y móvil me gustan como están con lo que no quiero que se vean modificadas.
Muchas gracias!
saludos
Luis
La página con la que necesito ayuda: [accede para ver el enlace]
-
Hola @azulejosonlineelchollo,
Para lo que estás buscando necesitarás añadir el siguiente código:
.header-bottom{ position: fixed; top: 0; left: 0; right: 0; }
Y claro, en este caso, para que afecte solo a la versión desktop tendrás que usar media queries a partir de 1025px
Espero haberte ayudado, saludos
-
Esta respuesta fue modificada hace 2 años, 3 meses por
Alvaro Torres.
Hola Álvaro,
gracias por contestar. No acaba de funcionar como me esperaba ya que como podrás ver inicialmente el menú no esta en la parte superior, con lo que únicamente tiene que quedarse en la parte superior una vez llegues a él. Tipo como la funcionalidad Sticky
muchas gracias,
un saludo!
Luis Blasco
Hola @azulejosonlineelchollo,
Sospechaba que en realidad querías usar sticky en lugar de fixed. Pero no propuse esa solución porque no lo entendí así inicialmente.
Entiendo que quieres que el elemento
header-bottom
, estando inicialmente más abajo, quede pegado al borde superior una vez hagas scroll. Bien, pues estás en lo cierto, lo puedes hacer a través de la declaraciónsticky
. Lo que ocurre en tu web es que la estructura HTML no es la apropiada, deberías colocar el elemento sticky al mismo nivel que el resto de los elementos de la página. Es decir, el elemento#masthead
podría ser sticky o sacarheader-bottom
a su nivel.Espero haberme explicaod correctamente esta vez
🙂Gracias Álvaro,
lo marco como resuelto
saludos!
-
Esta respuesta fue modificada hace 2 años, 3 meses por
- El debate ‘Fijar «Header Bottom» en versión ordenador’ está cerrado a nuevas respuestas.