Alinhamento vertical

[FelipeMorais 0]

Galera estava procurando algum modo de alinhar verticalmente uma div!

Aqui mesmo no fórum achei um link que levava ao site http://www.jakpsatweb.cz/css/css-vertical-...r-solution.html

 

A questão é que eles usam 3 divs para fazer o alinhamento, o que deixa bem feio o código.

Então pensei um pouco para tentar fazer o alinhamento. Logo na primeira deu certo!

Quando procurei no fórum achei algumas que usavam position:absolute; e não davam sempre certo!

fiz assim:

 

index.htm

<div id="geral"><div id="central"> any text<br>		any height<br>		any content, for example generated from DB<br>		everything is vertically centered</div></div>

estilo.css

#geral {width: 600px;height: 600px;background:black;}#central {color:black;margin-top:40%; <!-- aqui ficou 40% pois conta da borda do div pai até a borda do div filho, certo? se fosse 50% a div filho começaria na metade do div pai e assim não estaria alinhado verticalmente! -->margin-left:40%;background:white;height: 100px;}

Gostaria de saber se tem algum problema com esse código, já que faz a mesma coisa do outro que usa 3 divs e é bem mais simples! Existe algum caso em que ele não funcionaria? Se souber post sua opinião por favor!

 

Obrigado!

[Maujor 144]

Um tutorial mostrando como alinhar verticalmente uma página

[FelipeMorais 0]

Ja tinha visto esse tutorial mesmo assim obrigado!A minha dúvida é quanto alinha verticalmente uma div dentro de outra div!Vou tentar explicar melhor!tenho uma div que tem um background em forma de quadrado, mais ou menos assim:----------------|xxxxxxxxxx||xxxxxxxxxx|----------------Dentro dessa div eu preciso colocar uma figura que vai ser rotativa, ou seja, não será sempre a mesma figura porem sempre com as mesmas dimensões!Vai ficar assim----------------|xxx -----xxx||xxx| fi |xxx||xxx| gu|xxx||xxx| ra |xxx||xxx------xxx|----------------Essa figura do meio é um background tambem!Nota¹: o "x" representa os espaços vazios!Nota²: resolvi o problema com a propriedade de background-position: center center; Já tinha tentado com ela mas não tinha tido efeito algum usado assim: background: url(images/contato.jpg) center center;Só funcionou quando separei! Obrigado pela resposta!