datatable header no show correctly

I have a table with datatables but I can not display correctly within a dialog.

<div id="dialogonuevacita" title="Selección para cita">
<p> {% trans %}Seleccione el médico{% endtrans %}:
<select id="seleccionmedico">
{% for medico in medicos %}
<option value="{{medico.id}}">{{medico.nombre}}</option>
{% endfor %}
</select>
</p>

<p id="fechadialogo">aqui se pondra la fecha</p>

<table cellpadding="0" cellspacing="0" border="0" class="display" id="tablaseleccion">
<thead>
<tr>
<th>{% trans %}Id{% endtrans %}</th>
<th>{% trans %}Nombre{% endtrans %}</th>
<th>{% trans %}Apellido1{% endtrans %}</th>
<th>{% trans %}Apellido2{% endtrans %}</th>
<th>{% trans %}Dni{% endtrans %}</th>
<th>{% trans %}Acciones{% endtrans %}</th>

</tr>
</thead>

<tbody>
{% for cliente in clientes %}

<tr>
<td>{{ cliente.id }}</td>
<td>{{ cliente.nombre |capitalize }}</td>
<td>{{ cliente.apellido1 |capitalize }}</td>
<td>{{ cliente.apellido2 |capitalize }}</td>
<td>{{ cliente.dni }}</td>
<td>seleccion</td>
<!--<td><div class="seleccionparacita boton">Seleccionar</div></td>-->
</tr>
{% endfor %}
</tbody>

</table>
</div>
Dialog:

$("#dialogonuevacita").wijdialog({
autoOpen: false,
show: "Scale",
hide: "Scale",
height: 600,
width: 800,
buttons: {
Cancelar: function () {
$(this).wijdialog("close");
}
}
});
image : http://www.subirimagenes.com/imagen-capturadepantalla-8317200.html

the table show correctly without dialog. thanks.