Ir para conteúdo

POWERED BY:

Arquivado

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

Icaro Rodrigues Shimazu

colocar uma imagem num certo lugar da página

Por , em Desenvolvimento frontend

Recommended Posts

Icaro Rodrigues Shimazu    0

Icaro Rodrigues Shimazu
Postado

Olá rapaziada do fórum...

Estou com uma duvida que está me matando aqui..

Espero que vocês possam me ajudar.

É o seguinte...

Eu queria colocar uma imagem num certo lugar da página usando os seguintes códigos

left: 39%;
top: 30%;

position: absolute;

Soque quando mudo a resolução as imagem se movem do lugar

Compartilhar este post

Link para o post
Compartilhar em outros sites

MaikeES    18

MaikeES
Postado

Assim vai ficar sempre a 39% da direita e a 30% da esquerda a imagem se meche pois 39% de 800 por exemplo é diferente de 39% de 1000. Tente dimensionar com px de distância para ficar sempre x px de distância...

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Não use absolute então.

Compartilhar este post

Link para o post
Compartilhar em outros sites

MaikeES    18

MaikeES
Postado

Não entendi o que você precisa, seu código define o seguinte:

 

left: 39%; 39% do canto esquerdo da tela
top: 30%; 30% do topo da tela

position: absolute; Será contado o left e top do inicio do Brownser e não do objeto que está tratado.

 

Tendo isto em mente nos diga o que está dando errado?

Ou o que precisa ser feito?

preferência envie-nos um link de onde está seu projeto para avaliarmos.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Icaro Rodrigues Shimazu    0

Icaro Rodrigues Shimazu
Postado

É o seguinte, o código é esse:

.botao1 {
height: 48px;
width: 79px;
left: 30px;
top: 30%;
position:absolute;
}
Eu quero que ele se mude de posição alinhado junto com a logo quando a resolução muda também.
E se tiver outra técnica de alinhamento que não seja essa, ficaria muito agradecido se me ajudar

Um exemplo claro e quando você clika ali na janela do navegador para a tela ficar menor...

Os botões do meu projeto se movem desalinhado com a logo.

Queria que eles ficassem alinhados.

Se tiver outra técnica de alinhamento ficaria grato se me fala-se

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Eu falei lá em cima: não use absolute.

 

Se tiver dúvidas sobre como fazer sem absolute, poste o layout ou um link para o site.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Icaro Rodrigues Shimazu    0

Icaro Rodrigues Shimazu
Postado
Os códigos são esses.Passei uma madruga inteira tentando ajeitar mais não consigo de forma alguma. tentei de tudo
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
html,body{
margin: 0; padding: 0; z-index: 1;
list-style: none;
background:#f8c205 url(img/background.jpg) repeat-x fixed;;;
}
.spc {
height: 48px;
width: 79px;
position:absolute;
float:left;
left: 25%;
top: 30%;
}
.spc3 {
position: absolute;
top: 30%;
left: 38%;
width: 88px;
height: 49px;
}
.botao2{
background-image:url(img/botao2.png);
}
.botao1{
background-image:url(img/botao1.png);
}
.botao3 {
height: 46px;
width: 111px;
left: 40%;
top: 30%;
position: relative;
}
.logo {
background-image:url(img/logotipo2.png);
}
.spc2 {
height: 200px;
width: 500px;
left: 30%;
top: 0%;
position:absolute;
}
</style>
</head>
<body bgcolor="#f8c205">
<div class="logo spc2">
</div>
<div class="botao1 spc"></div>
<div class="botao2 spc3"></div>
</body>
</html>

o incrível é que desenvolvi um site com essas técnicas e não deu problema na resolução já desmontei e remontei o site todinho vendo oque poderia ser

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

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

  Aceito