Hola.
La página es de la intranet corporativa, así que no te puedo dar un enlace. Aquí tienes el código. El CSS está un poco desordenado, no os asusteis mucho...
Cambios apreciables: Una línea azul debajo del título y el formato de la tabla al completo, por ejemplo.
Muchas gracias.
Un saludo.
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "h t t p : / / w w w . w 3 . o r g / T R / x h t m l 1 / D T D / x h t m l 1 - s t r i c t . d t d">
<html xmlns="h t t p : / / w w w . w 3 . o r g / 1 9 9 9 / x h t m l">
<head>
<title>Enter the title of your HTML document here</title>
<link rel="stylesheet" type="text/css" href=".\css\mystyle.css">
</head>
<body>
<div id="contenido" style="background-color: white;">
<div id="CurrentAccountdiv" style="display: block;">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td class="background_tablet titulo_principal linea_inferior">
<font class="link_text_bold">
<span>Datos del Perfil</span>
</font>
</td>
</tr>
</tbody>
</table>
<div id="ayuda" class="text11" align="right">
<a href="#" target="popup" onclick='window.open(this.href, this.target, "height=768,width=1024,left=50,top=50,resizable=yes,scrollbars=yes"); return false;'>
<img src=".\img\cuestion_blue.gif" alt="Ayuda" title="Ayuda" border="0"/>
</a>
</div>
</div>
<div style="padding: 10px 5px 10px 25px; font-style:">
<div style="width: 100%;">
<table id="Datos_Socio_Superior">
<thead>
<tr>
<th>
<span>
<img src=".\img\marca.gif" border="0" width="4" height="8"/>
Código TIPI
</span>
</th>
<th>
<span>
<img src=".\img\marca.gif" border="0" width="4" height="8"/>
Código de perfil
</span>
</th>
<th>
<span>
<img src=".\img\marca.gif" border="0" width="4" height="8"/>
Tipo de perfil</span>
</th>
<th>
<span>
<img src=".\img\marca.gif" border="0" width="4" height="8"/>
Nombre y apellidos
</span>
</th>
<th>
<span>
<img src=".\\img\marca.gif" border="0" width="4" height="8"/>
Forma de Pago
</span>
</th>
<th>
<span>
<img src=".\\img\marca.gif" border="0" width="4" height="8"/>
Préstamo
</span>
</th>
<th>
<span>
<img src=".\\img\marca.gif" border="0" width="4" height="8"/>
Retención
</span>
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
0000000000
</td>
<td>
0000
</td>
<td>
Consultor
</td>
<td>
Socio 21909
</td>
<td>
Transferencia
</td>
<td>
no
</td>
<td>
no
</td>
</tr>
</tbody>
</table>
<table id="Datos_Socio_Inferior" class=" TeseoFormDecorated">
<tbody>
<tr>
<th>
<span>
<img src=".\\img\marca.gif" border="0" width="4" height="8"/>
Informacion del Perfil
</span>
</th>
<th>
<span>
<img src=".\\img\marca.gif" border="0" width="4" height="8"/>
Desglose
</span>
</th>
<th width="15%" rowspan="2">
<fieldset class="marcoBorde">
<legend class="marcoTituloAdm">Código Perfil</legend>
<span style="white-space: nowrap; outline: 0;" >
<input id="lnCodAdmtdToFind" name="lnCodAdmtdToFind" class="inputTextShort" onkeypress="javascript:eventOnKeyIntro()" type="text" align="left"/>
<a href="#" class="img_link"><img style="width: 20px; height: 20px; border: 0px solid; padding:0px; margin:0px;" src=".\img\detalle.gif" alt="Saldos Administrado [ENTER]" title="Saldos"/></a>
</span>
</fieldset>
</th>
</tr>
<tr>
<td>
Consultor con Filiales.
</td>
<td>
<input id="strIndBusquedaNivel2" name="strIndBusquedaNivel2" value="on" checked="checked" onclick="javascript:eventOnChangeBox()" type="checkbox"/>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- ___________________________________________________________________________________________________________ -->
<!-- _____ LINEA DE SEPARACION HORIZONTAL ___________________________________________________________________ -->
<!-- ___________________________________________________________________________________________________________ -->
<hr/>
<br/>
<!-- ESTE DIV VA A CONTENER LA INFORMACION DE LAS TABLAS -->
<div id="Datos_Cuerpo_Informe" style="width: 100%;">
<div>
<!-- ___________________________________________________________________________________________________________ -->
<!-- _____ TABLA DE DE TOTALES____ ____________________________________________________________________________ -->
<!-- ___________________________________________________________________________________________________________ -->
<table>
<caption>Total</caption>
<thead>
<tr>
<th class=" recuadro_tablas no_partir_contenido">
<span>
<img src=".\img\marca.gif" valign="middle" border="0" width="4" height="8"/>
Producto
</span>
</th>
<th class=" recuadro_tablas no_partir_contenido">
<span>
<img src=".\img\marca.gif" valign="middle" border="0" width="4" height="8"/>
Margen Disponible
</span>
</th>
</tr>
</thead>
<!-- ___________________________________________________________________________________________________________ -->
<!-- _____ LINEA DE DATOS DE LA TABLA DE TOTALES _____________________________________________________________ -->
<!-- ___________________________________________________________________________________________________________ -->
<tbody>
<tr>
<td class=" recuadro_lateral_tablas no_partir_contenido">
<span>
<a href="#" class="text">
Margen Total
</a>
</span>
</td>
<td class=" recuadro_lateral_tablas no_partir_contenido" title="Mostrar Movimientos Partidas Abiertas" align="right"><span>
<a href="#" class="text">
0,00
</a>
</span>
</td>
</tr>
<tr class="tablet_off">
<td class=" recuadro_lateral_tablas no_partir_contenido">
<span>
<a href="#" class="text">
Margen Parcial 1
</a>
</span>
</td>
<td class=" recuadro_lateral_tablas no_partir_contenido" title="Mostrar Movimientos Partidas Abiertas" align="right"><span>
<a href="#" class="text">
0,00
</a>
</span>
</td>
</tr>
</tbody>
</table>
</div> <!-- fin div de la tabla de totales -->
</div>
<div> <!-- DIV de pie de página-->
</div>
</body>
</html>
CSS
Código:
BODY {
text-align: left;
background-color:#EEE;
font: 10px normal Arial, Verdana, sans-serif;
}
CAPTION {
white-space: nowrap;
text-align:left;
padding: 10px 10px;
font-size: 110%;
font-weight: bold;
}
#contenido{
min-width: 850px; width: 100%;
width: expression(document.body.clientWidth < 850? "850px" : "auto");
font: 10px normal Arial, Verdana, sans-serif;
}
#Datos_Socio_Superior, #Datos_Socio_Inferior {
width: 100%; font: 10px normal Arial, Verdana, sans-serif;
}
#Datos_Socio_Superior th, #Datos_Socio_Inferior th {
white-space: nowrap; vertical-align: middle;
padding: 3px; text-align: left;
}
#Datos_Socio_Superior td , #Datos_Socio_Inferior td{
white-space: nowrap; vertical-align: middle;
padding: 3px 18px;
}
#Datos_Cuerpo_Informe table {
margin: 10px; cellpadding: 3px; cellspacing: 0px;
border-collapse: collapse; border: 1px solid #A6B0F8;
text-align: left; font: 10px normal Arial, Verdana, sans-serif;
}
#Datos_Cuerpo_Informe table td, #Datos_Cuerpo_Informe table th{
padding: 3px 5px;
}
#Datos_Cuerpo_Informe table th{
background-color: #A6B0F8;
}
th.no_partir_contenido, td.no_partir_contenido {
white-space: nowrap;
}
td.linea_inferior {
border-bottom: 1px solid #0066CC;
}
td.recuadro_lateral_tablas {
border-left: 1px solid #A6B0F8; border-right: 1px solid #A6B0F8;
}
.recuadro_tablas {
border: 1px solid #A6B0F8;
}
.titulo_principal {
white-space: nowrap; padding-left: 28px; height: 23px;
}
.title {font-family: Arial,Verdana;font-size: 1.3em;color: #474747;text-decoration: none;}
.text11 {font-family: Arial,Verdana;font-size: 1.1em;color: #000000;text-decoration: none;font-weight:bold;}
.url_text {font-family: Arial,Verdana;font-size: 1.1em;color: #474747;text-decoration: none;}
.text {font-family: Arial,Verdana;font-size: 10px;color: #000000;text-decoration: none;font-weight:bold;}
td a {color: #000;text-decoration: none;outline:0;padding:0px;margin:0px; width: 100%; height: 100%; display: block; }
a.text:active, a.text:focus, a.text:link, a.text:visited {font-weight:bold;}
a.text:hover {font-weight:bold; color: #CC33DD}
.tablet_off {background-color:#E0E0E1;}
.tablet_on {background-color:#FFF;}