Centralizar objeto na vertical

[aureo2006 1]

Eu tenho um arquivo swf do flash gostaria de centralizar ele na vertical, independente da resolução da tela..como eu faço isso? Até agora não consegui....o comando vertical-align não funcionou...tem alguma outra forma que alguem saiba?

[inforsis 1]

Tenta assim:

 

#flash {position:absolute; top: 50%; left: 50%;}

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Cesão 1]

isso vai depender de onde tá o teu flash, veja o exemplo

<table height="100%" width="100%">
<tr>
<td valign="middle">flash aqui</td>
</tr>
</table>

help, mas esse fórum aqui é de Webstandards... ou seja, lidamos com semântica... tabela é apenas para dados tabulares, não para estrutura ou posicionamento.

 

inforsis, essa lógica que você passou está certa, mas tem que ser tratada, ja que o CSS nao posiciona o objeto pelo seu centro, e sim pelo seu canto superir esquerdo... tem que tratar com o margin-top e o margin-left. sem contar que se o div dele estiver dentro de outra div não irá funcionar, pois nesse caso o position tem que ser relative.

 

aureo, pelo que sei o CSS não possui um parametro nativo para esse tipo de alinhamento. Pesquisei diversas vezes e nunca achei algo que posicionasse... mas existe uma 'gambiarra' que gostei e uso bastante (aliás, na verdade, os maiores profissionais da área usam esse tipo de posicionamento).

 

Veja a lógica aqui e espero que ajude:

http://www.tableless.com.br/centralizando-...ertical-com-css

 

Use esta lógica que dará certo, mas lembre-se.. essa lógica não serve quando o div posicionado está dentro de outro div.. caso esteja, apenas troque o position de absolute para relative. ;)

[Giovani 104]

Tirou as palavras da minha boa boca Cesão! http://forum.imasters.com.br/public/style_emoticons/default/natal_noel.gif

help, mas esse fórum aqui é de Webstandards... ou seja, lidamos com semântica... tabela é apenas para dados tabulares, não para estrutura ou posicionamento.

[inforsis 1]

inforsis, essa lógica que você passou está certa, mas tem que ser tratada, ja que o CSS nao posiciona o objeto pelo seu centro, e sim pelo seu canto superir esquerdo... tem que tratar com o margin-top e o margin-left. sem contar que se o div dele estiver dentro de outra div não irá funcionar, pois nesse caso o position tem que ser relative.

Não fiz o tratamento melhor da informação por questão de tempo, porém no intuito de ajudar passei a lógica que acredito resolver o problema. Enfim Cesão obrigado pelo comentário e pela informação para complementar. Acredito que irá ajudar o aureo2006.

 

+ o título da seção não tá deixando muito claro que não pode HTML

Webstandards: CSS / XML / XHTML/ HTML

help, a observação do Cesão esta correta. Afinal as tags do html devem ser usadas para seus determinados fins. http://forum.imasters.com.br/public/style_emoticons/default/natal_wink.gif

[webflex 0]

Olá,

 

Tem um tópico aqui muito falado acerca dessa matéria, pois é algo muito complicado e complexo:

 

Link

 

Cumps \o/

[aureo2006 1]

POr incrível que ossa parecer eu não consegui fazer o alinhamento vertical com nenhuma das opções indicadas. Vou descrever tudo que eu fiz. Como flaei, eu possuo uma animação em Flash que quero colcoar numa página inicial. POis bem, a página não tem nada de mais. Os comandos embutidos são os seguintes:

 

body {
background: url(../img/design_grid.gif) repeat;
}

Criei uma classe para criar uma borda no objeto...

.objeto{
border: thin solid #FFFFFF;
}

E depois fui tentar as sugestões de alinhamento.

Sugestão 1 -

Criar uma tabela, sugestão do Help...

<table height="100%" width="100%">
<tr>
<td valign="middle">flash aqui</td>
</tr>
</table>

Nada feito.

Sugestão 2 - Criei div com os seguintes parametros e coloquei animação dentro

#centro {
width:600px;
height:450px;
position:absolute;
top:50%;
left:50%;
margin-top:-50px;
margin-left:-50px;
}

Não funcionou...

Sugestão 3 - Criar uma div e dar somente os comandos osition, top e left. Coloquei a animação dentro dela.

#flash {position:absolute; top: 50%; left: 50%;}

Não funcionou...

Não sei se fiz algo errado em algum dos procedimentos...mas eu fiz como descrevo e não deu certo...talves o objeto não suporte algum deses comandos...Ma valeu pela tentativa de todos que tentaram uma sugestão...

Há..se alguem quiser ver o que digo, está aqui:

[brcontainer 16]

tem algum link com o seus TESTES??

um site seu?

ja ajuda um pouco

;)

[webflex 0]

Olá,

 

HTML:

<div id="centro">
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','600','height','450','class','objeto','src','img/inicial','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','img/inicial' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="600" height="450" class="objeto">
	  <param name="movie" value="img/inicial.swf" />
	  <param name="quality" value="high" />
	  <embed src="img/inicial.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="600" height="450"></embed>
	</object>
</noscript>
</div>

CSS:

* {
	margin: 0px; 
	padding: 0px;
	list-style: none;
	}
	
#centro {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 600px;
	height: 450px;
	margin-top: -225px;
	margin-left: -300px;
	}

Cumps \o/

[programador php 0]

cara tenta esse

 

#alerta {
	position: absolute;
	top: 50%;
	left: 50%;
	height: 150px; /* tamanho da altura do seu flash */
	width: 400px; /* tamanho da largura do seu flash */
	margin-top: -75px;  /* tamanho da altura do seu flash/2 = 75. */
	margin-left: -200px; /* tamanho da largura do seu flash/2 = 200. */
	text-align: center;
	z-index: 999;
}

espero que ajude

 

abraço

[cassiano óliver 1]

esse posicionamento pode ser feito no próprio flash...

no 1º quadro chave, coloque isso...

 

ACTIONSCRIPT

function CentralizarSite() {

        _root.conteudo._y = Stage.height/2;

        _root.conteudo._x = Stage.width/2;

}

 

Stage.scaleMode = "noScale";

 

StageAlign = new Object();

StageAlign.onResize = function() {

        CentralizarSite();

};

Stage.addListener(StageAlign);