Alinhamento vertical de uma <div> dentro da outra
Boa noite,
Bom galera, peguei um site pela metade aqui que outra pessoa não conseguiu fazer, e como não tinha tempo para reestruturar tudo tive q pegar todo o código do colega, porém em uma área, tenho que fazer alguns blocos e não estou conseguindo alinhar verticamente o que preciso, se alguém puder me dar uma luz, vou colocar o código aqui, e explico o problema abaixo:
<div class="trMulti">
<div class="td1Multi">
<div class="imgMulti"><img src="images/wallpaper.jpg" border="0" alt="Wallpaper" /></div>
<div style="float:left; line-height:132px; padding-top:10px;">
<div class="divMulti"><img src="images/divMulti.jpg" border="0" alt="Div" style="padding-top:10px;" /></div>
</div>
<div class="linkMulti">
<div>
<a href="#" title="Wallpaper" class="linkMultiAmarelo">800x600</a>
<a href="#" title="Wallpaper" class="linkMultiAmarelo">1024x780</a>
<a href="#" title="Wallpaper" class="linkMultiAmarelo">1280x1024</a>
</div>
</div>
</div>
abaixo o código CSS apenas desses blocos:
div.trMulti { width:94%; display:block; padding-bottom:10px; height:156px; }
div.td1Multi {float:left; width:377px; height:146px; background:#000; padding:7px; line-height:146px;}
div.td2Multi {float:right; width:377px; height:146px; background:#000; padding:7px; line-height:146px;}
div.imgMulti { float:left; width:217px; padding-right:20px; }
div.divMulti { width:8px; height:110px; display:block; }
div.linkMulti { float:left; width:100px; padding-left:15px; height:132px; line-height:132px; text-align:center;}
div.linkMulti div { display:block; height:auto; line-height:normal; top:30%; position:relative; }
div.linkMulti div a.linkMultiAmarelo { display:block; width:120px; color:#F5B908; text-decoration:none; padding-bottom:2px; }
Bom o q eu preciso, é alinhar o bloco onde ficam os links centralizado verticalmente, aqui estou usando uma top:30%; apenas afim de demonstração para o cliente, porém esses dados virão dinamicamente do painel de controle, ou seja, a quantidade de dados não é uma quantidade fixa, por isso não posso usar o top:; nem o padding-top:;, pois poderão ser 3 link ou até no máximo 6.
Já googlei demais, já olhei no forum, já usei o line-heigth como vcs podem ver aí, porém acontece qndo no bloco filho eu coloco line-height:normal; ele volta a ficar no topo. Alguém poderia me dar uma luz?
Atenciosamente,
Brenno ferreira
Discussão (3)
Carregando comentários...