Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Nova Palestina

Como criar uma Div com posição fix para qualquer resuloção de tela? L

Recommended Posts

Criei uma div com posição fixa para acompanhar a barra de rolagem, só que ao navegar com uma resolução diferente ela sai do local definid para ela. Como corrigir isso?

 

Código que está dentro do meu estilo.css

 

#i_direito {
/*Margem zero de todos os lados*/
margin: 0;

/* É para ser mostrada*/
display:block;

/* Posição é fixa*/
position:fixed;

/* Tamanho da div*/
width:315px;

/* Largura da div*/
height:640px;

/* Quantos pixels do rodape do navegador*/
bottom: 0px;

/* Quantos pixels terá do lado direito do navegador*/
right:160px;

/* Cor da Texto */
color:#000000;

/* Aparecera na frente de tudo*/
z-index:100;

/* Cor de fundo da div*/
background-color:;

/* Alinhamento do texto */
text-align:center;

/* Texto em negrito*/
font-weight:bold;
}

 

 

O que devo inserir nele?

 

Exemplo funcionando bem.... http://omelete.uol.c...serie-derivada/

 

 

Agradeço desde já?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Nova Palestina,

Seu CSS não me parece ter problemas!

O local definido para ela é a 160px da direita da tela e 0px da parte de baixo, certo?

 

Você poderá fazer o resize quantas vezes quiser e ela continuará com essas configurações!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Isso mesmo. A visualização dela está perfeita no Chrome, Firefox e Internet Explorer na definição 1366x768, mas quando eu diminuo a resolução de tela a div se distancia do conteúdo do site e quando aumento a div cobre o conteúdo do site.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Mas você gostaria que o menu-lateral ficasse fixo em relação ao que, body? a div principal?

Na verdade não se pode fazer muita coisa, pois se deixar fixo ele cobre o conteúdo dependendo da resolução, a não ser que você o esconda (talvez com JS) a partir de X resolução com media queries.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Você pode fazer o seguinte:

 

#i_direito {
	position:fixed;

	width: 315px;
	height: 640px;

	bottom: 0px;
	left: 50%; /* pra deixar a div a 50% da lateral esquerda */
	
	margin-left: -320px; /* move ela a menos a metade da largura, pra centralização ficar correta */

	color: #000000;

	z-index: 100;

	background-color: #900;

	text-align: center;
	
	font-weight: bold;
}

Tenta ai e me fala..

 

Boa sorte..

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.