1

Possuo uma aplicação onde tenho um menu normal no topo da página, e logo abaixo dele um formulário, onde esse formulário tem que ser fixo, de uma forma que quando eu role a página para baixo, esse formulário fique no topo da página, e o resto da página vá correndo por trás dele.

Meu problema está em deixar esse formulário da forma que preciso. Coloco a propriedade position: fixed, ele fica fixo, mas ou por cima do menu, ou totalmente desposionado na tela, e também pelo fato que vou usar essa mesma aplicação no celular, estou meio perdido em como fazer.

4
  • O menu será fixo no topo tambem? O form deve somente passar por baixo do menu?
    – akira-ito
    Commented 24/11/2015 às 13:04
  • @oOAkiraOo. Minha ideia inicial é o menu não ser fixo e quando eu subir a pagina, esse form ficar fixo no topo, mas se for o caso, deixo o menu fixo tbm sem problemas. Commented 24/11/2015 às 13:19
  • 1
    para colocar ele por cima, use no CSS: z-index: 1000; Commented 24/11/2015 às 13:40
  • Se a resposta abaixo não for a solução, por favor confira: Como criar um exemplo Mínimo, Completo e Verificável, este guia ajuda você a conseguir a resposta mais exata possível para resolver o problema.
    – brasofilo
    Commented 24/11/2015 às 14:23

2 Respostas 2

3

O elemento pai do form deve estar:

position: fixed;
top: 0;
width: 100%;
z-index: 99999; /* Pra Garantir */ 
2

Caso o menu seja no topo, utilize uma margem do top para garantir que não fique sobre o menu, margin-top: 150px e utilize a propriedade z-index: 999 para garantir que fique sobre os elementos de forma fixa.

CSS:

form{
     position: fixed;
     margin-top: 100px; // distancia do top
     right: 0;
     z-index: 9999;
}

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .