Estoy tratando de hacer un formato de un carnet en HTML
para lo cual estoy anidando tablas.
El problema es en que se está montando una tabla sobre otra.
¿Que error estoy cometiendo?
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title>Carnet</title>
<style>
@page{
size: 21.6cm 6cm;
margin: -2px ;
padding: 0px;
}
table{
empty-cells: hide;
border: 1px solid;
}
td {
border:hidden;
}
.logo{
width: 80px;
height: 80px;
}
.titulo{
font-size: 14px;
text-align: center;
font: small-caps 90% serif;
}
.detalle{
font-size: 14px;
}
.principal{
width: 120%;
margin: -2px;
border: none;
background-color: red;
}
.principaldos{
width: 80%;
margin: -2px;
border: none;
background-color: green;
}
.subtitulo{
text-align: center;
font-weight: 700;
}
</style>
</head>
<body>
<table>
<tr>
<td>
<table class="principal">
<tr>
<td class="logo"><img src="images/logoSisben.png" style="width:100%"/></td>
<td class="titulo" colspan="3">Sistema de Identificación y Clasificación de Potenciales Beneficiarios para Programas Sociales</td>
</tr>
<tr>
<td class="subtitulo" colspan="4">GIRARDOT - CUNDINAMARCA</td>
</tr>
<tr>
<td class="detalle" colspan="2">Carnet No.:</td>
<td class="detalle" colspan="2">1790</td>
</tr>
<tr>
<td class="detalle" colspan="2">Fecha de nacimiento:</td>
<td class="detalle"> 02/12/1952 </td>
</tr>
<tr>
<td class="detalle" colspan="2">Doc. de Identidad:</td>
<td class="detalle" colspan="2"> CC N° 21116472</td>
</tr>
<tr>
<td class="detalle">Nombre:</td>
<td class="detalle" colspan="3"> MARIA TERESA GARZON BAQUERO</td>
</tr>
<tr>
<td class="detalle" colspan="2">Programa:</td>
<td class="detalle" colspan="2"> DESPLAZADOS</td>
</tr>
</table>
</td>
<td>
<table class="principaldos">
<tr>
<td class="titulo" colspan="4">Este carnet es intransferible. Si es usado por otra persona, sera confiscado. En caso de perdida favor avisar a la administracion Municipal</td>
</tr>
<tr>
<td class="detalle" colspan="2">Fecha de Expedición</td>
<td class="detalle" colspan="2">Fecha de Vencimiento</td>
</tr>
<tr>
<td colspan="3" rowspan="3">
Firma Autorizada
</td>
</tr>
<tr>
<td>DIEGO FERNANDO NUÑEZ B.</td>
</tr>
<tr>
<td>DIRECTOR</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>