Tenho uma tag header, onde está meu menu, está tag header tem width de 80% da tela e está fixada no topo. Tenho logo abaixo do menu uma imagem, que quero que pegue 100% da tela, porém está dentro da mesma tag header. Tem como esta imagem não pegar o width da tag header, e ao invés disso ficar com 100% da tela, mas mesmo assim ficar fixada no topo junto com a header?
1 Resposta
Tem.
Defina a imagem com:
position: fixed;
width: 100%;
left: 0;
right: 0;
margin: auto;
margin-top: 100px; /* Aqui é o Tamanho do Header em Px */
O margin-top
deve ser o height
do <header>
.
-
Deu certo! Mas tive um problema. A imagem ficou fixada abaixo do menu exatamente como deveria, mas não ficou centralizada na página, ficou para a direita, escondendo um pedaço da imagem inclusive. Alguma ideia de por que isso está acontecendo? Commented 26/11/2015 às 11:13
-
Adicionei mais três propriedades,
left, right e margin: auto
. Adicione elas. Commented 26/11/2015 às 11:15 -
1Perfeito! Ficou exatamente do jeito que eu precisava, muito obrigado pelo seu tempo e ajuda! ;) Commented 26/11/2015 às 11:17