Posicionamento de texto

[Ze do Caixao 0]

Opa, primeiro post aqui.

 

Seguinte, tô fazendo um site e tô com uma dúvida que eu já tive um tempo atrás quando tava fazendo outro. Nem me lembro se consegui arrumar, mas se consegui não lembro e não lembro como foi arrumado.

 

Site em 800x600, centralizado, etc etc.

Enfim, tô com uma div no topo para um banner (que está como background dessa div). Preciso colocar um texto por cima do banner, que fique mais ou menos no centro (mais ou menos!! não exatamente) e um flash à direita.

Até a inserção do flash e do texto, tudo ok. Quando eu salvo, se abro em 800x600 o banner centraliza legal e tal, agora, o texto e o flash estão como se não tivessem um lugar fixo na página. Como dizer... eles "andam" junto com ela. Se eu deixo a tela em 1024 ele vai pra cima da logo do cliente, se eu deixo em 800x600 ele fica na posição certa.

Já até li uns tutoriais de posicionamento mas não tô entendendo direito como que eu faço pra ela ficar em um lugar só, independente se estiver em 800 ou em 1024.

 

Se alguém puder ajudar, agradeço. Valeu!

[Joww 0]

ze.. n tem como postar o site ai nao pra exarminar melhor?

faz uma previa rapida sei la.. soh pra eu mexer aki e tentar t ajudar..

abraco

[Ze do Caixao 0]

E aí cara, beleza?

 

Seguinte, tirei uns prints pra você ver como tá: http://xs224.xs.to/xs224/08095/site1837.jpg

http://xs224.xs.to/xs224/08095/site2339.jpg

 

Tá acontencedo que quando maximiza o texto vai pra cima da logo deles, aí tá me quebrando as perna.

[Giovani 104]

Ze do Caixao, seja bem vindo ao fórum iMasters.

Por gentileza, leia o link Como criar um tópico para o seu problema.

[Joww 0]

po ze n sei como você ta fazendo.. mais uma sugestao q eu axo q arrumaria isso seria:

po eu diviria essa barra marrom em 2 partes, a do logo e a q tem soh o degrade..

e colocaria eles em tabela com borda 0, | (logo) | (degrade como background na celula) |

e escrevia por cima sei la..

[Joww 0]

ze axo q soh d você ja por isso numa tabela ja vai arrumar nao sei.. testa ai

[Ze do Caixao 0]

O, foi mal Giovani! Já li lá, desculpe.

 

Joww, acabei pensando nisso agora há pouco também, acho que vai ser o jeito.

Mas com tabela eu não faço nemmmm... de jeito nenhum.

Mas valeu pelas dicas.

[inforsis 1]

Ze do Caixao, Bom Dia!

Então após a leitura do link que o Gio sugeriu, você poderia postar um link para o pessoal analisar melhor como você esta fazendo e poder propoor uma solução...

 

Só uma pergunta, quando ocorre o problema o que acontece se você aperta F5 (os objetos voltam para o lugar?) :unsure:

 

ze axo q soh d você ja por isso numa tabela ja vai arrumar nao sei.. testa ai

Desculpa, mais isso não seria a solução mais apropriada, mais sua intenção em ajudar concerteza é valida... ;)

[Ze do Caixao 0]

Bom dia, Inforsis.

Acho que você não entendeu muito bem o problema. Na verdade é o seguinte... eu tô usando resolução de 1024 aqui, mas eu estou fazendo e tenho que fazer ele em 800x600 (resolução padrão e essas coisas que todo mundo sabe).

Então quando eu clico naquele botãozinho "restaurar abaixo" ao lado do botão de fechar, ele me mostra a resolução de 800x600 e dessa maneira ele fica correto, centralizadinho, etc. Agora quando eu aperto para maximizar a janela, não sei o que acontece mas o texto (ou o banner) parecem mudar de posição e o texto acaba sobrepondo numa parte que não deveria.

 

Vou colar o código para vocês darem uma olhada.

@charset "utf-8";
/* CSS Document */

p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	color: #662E10;
	text-decoration: none;
}
body {
	background-attachment: fixed;
	background-image: url(imagens/background.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	margin: 0px;
	padding: 0px;
}
a:link, a:visited, a:active {
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
	color: #662E10;
	text-decoration: none;
}
h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	font-weight: bold;
	color: #662E10;
	text-decoration: none;
}
#banner {
	background-image: url(imagens/banner.jpg);
	background-repeat: no-repeat;
	margin: 0px;
	padding: 0px;
	height: 200px;
	width: 760px;
	position: static;
	background-position: center;
	text-align: left;
	vertical-align: middle;
	z-index: 1;
	left: 100px;
	top: 0px;
}

 

Esse é o do estilo.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Untitled Document</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable -->
<link href="yarsayoor.css" rel="stylesheet" type="text/css" media="screen" />
<style type="text/css">
<!--
#links {
	position:absolute;
	left:197px;
	top:41px;
	width:301px;
	height:120px;
	z-index:1;
}
#tudo {
	padding: auto;
	width: 760px;
	margin-right: auto;
	margin-left: auto;
}
-->
</style>
</head>

<body>
<div id="tudo">
  <div id="banner"></div>
  </div> 
</body>
</html>

E esse da página que eu tô fazendo. Agradeço novamente, valeu.

[inforsis 1]

ho Desculpa se interpretei eerrado. http://forum.imasters.com.br/public/style_emoticons/default/yay.gif

 

Só uma pergunta, quando ocorre o problema o que acontece se você aperta F5 (os objetos voltam para o lugar?)

pode me responder?

 

(resolução padrão e essas coisas que todo mundo sabe).

Desculpa mais uma vez, mais não existe resolução "padrão" o que existe é resolução mais inidcada, afinal não podemos mandar na resolução do usuário... http://forum.imasters.com.br/public/style_emoticons/default/assobiando.gif

[Ze do Caixao 0]

Heheh, tudo bem.

 

Desculpa, não tinha visto a pergunta. Mas então, depende do modo que a tela está... se estiver maximizado as letras ficam encima do logo, se não, fica normal. Não sei porque que tá ocorrendo isso, que saco:(

 

Quando eu disse padrão eu quis dizer é que ainda é a mais usada, hehe.

[William Bruno 1501]

 

Lógico que é uma amostragem "relativamente pequena", e tb fiz a 'pesquisa' numa comunidade de jogo no Orkut, mas achei o resultado bastante interessante.

[donato 0]

Amigo, ta acontecendo isso pq você ta usando position absolute, está posicionando em relação à tela, por isso queno muda a reolução o objeto muda de lugar, pq ele mantem a medida da esquerda por exemplo a mesma em relação ao monitor e como o outro objeto está com position padrão, fica fixo e detona o alinhamento.

 

Exclui o position dos links e posicione corretamente q não mudará mais.

 

 

abraços