Problemas con el centrado de una tabla y su celda

[Haraz]

Saludos a todos,


Estoy comenzando con un diseño de una web y a los 5 minutos ya me encontré con mi primer problema. No soy muy experta en estas cosas así que decidí recurrir a vosotros.

El caso es que tengo la siguiente tabla:

Código:

<div class="centraTabla">
    <table class="tableGeneral">
        <tr>
            <td>
                <table align="left" class="tableCabecera">
             		<tr>
                        <td>
                        </td>
                    </tr>
                </table>
          </td>            
        </tr>
     
    </table>
    <table class="pie">
        <tr>
            <td>
                Diseño realizado ........</td>
        </tr>
    </table>
</div>

Con su CSS:

Código:

div.centraTabla{
    text-align: center;
    width:100%;
    height:790px;
    background-color:#1e618b;
}

.tableGeneral {
    margin: 0 auto;
    text-align: left;    
    border: solid 3px #cfe1f3;
    background-image:url('Images/background.jpg');
    background-repeat:no-repeat;
    width:780px;
    height:700px;
    background-color:White;
    background-position:10px;
    background-position:left;
    background-repeat:no-repeat;
    margin-top:20px;
    

}
.pie{
    width:780px;
    height:50px;
    background-color:Transparent;
    font-family:Gill Sans MT;
    font-size:small;
    color:#dbe6ec;
    
}
.tableCabecera
{
    margin:3px;
    width:100%;
    height:163px;
    background-color:Transparent;
    top:0px;    
}

El problema lo tengo en el <td> que marqué en negrita arriba. El caso es que el centrado del Div le afecta también a dicha celda y no quiero. Por que me sale centrada verticalmente. ¿Cómo puedo moverla?

Muchas gracias por leer.

Saludos

[debspain]

Hola Haraz,

Las celdas de las tablas estan centradas verticalmente porque es su comportamiento por defecto, no tiene nada que ver con la capa (la DIV no está centrada verticalmente).
Lo único que tienes que hacer es añadir al css:

.tableGeneral td,
.tableCabecera td {vertical-align:top}

De hecho, si pusieras solamente .tableGeneral td {vertical-align:top}, ya funcionaría, ya que la tableCabecera está dentro de tableGeneral y estaría heredando los estilos de sus celdas.

Salu2 ;)

[Haraz]

Muchas gracias por la solución y por responder tan rápidamente :3