Problema de alinhamento vertical da célula da tabela

Question

Eu defini float para uma das células da minha tabela.Mas agora não posso alterar o alinhamento vertical de seu conteúdo.Por padrão, ele move o conteúdo para o topo do div.Tentei valign: middle, vertical-align: middle sem sucesso.Aqui estão os resultados:

Com float: left

Sem float: left

Como posso alinhar verticalmente o conteúdo da célula com flutuação? E a marcação é assim

<td id="top_logo">
    <a href="index.php">
        <img src="core/design/img/logo.png" style="height:40px; padding:3px;"/>
    </a>
</td>
<td id="name" valign="middle"><?php include "core/code/includes/pr.name.php";?></td>

Answer 1

Não sei se isso vai ajudar (deixei os layouts baseados em tabela para trás agora), mas para resolver um problema semelhante usando divs diretos, você pode fazer o mesmo usando a regra line-height.

<div id="tableRow">
    <div id="leftCell"><img src="mylogo" /></div>
    <div id="middleCell">&nbsp;</div>
    <div id="rightCell">User Name Here</div>
</div>

Seu CSS seria criado para definir larguras / alturas, etc., o que eu acho que você não vai precisar para uma tabela, e para sua "célula direita", você definiria a altura da linha para ser igual à altura da linha:

#rightCell
{
    height: 30px;
    line-height: 30px;
}

O que acontece é que o texto é centralizado verticalmente no espaço da linha, o que, por ser igual à altura, dá a impressão de que também está no centro do elemento.

Agora, como eu disse, NUNCA tentei isso em uma célula de tabela, no entanto, qualquer navegador moderno deve permitir que você altere a propriedade display para block ou inline-block usando:

display: block;

Alterando o bloco para qualquer um dos outros tipos, quando necessário. Isso definirá o tipo de exibição da célula como um div (ou um intervalo, ou algum outro elemento), mas NÃO SEI que efeito isso terá na mesa.

Observe também que não estou tratando de navegadores mais antigos como o IE6 aqui, para que isso funcione de maneira geral, você pode ter que fazer alguns hacks para navegadores mais antigos se o suporte for necessário.