Empezar un tema nuevo

CSS en plantilla de impresión

Buenos días,
He realizado un diseño de una plantilla de impresión, pero al verla a través del PDF que genera esta funcion:

function generaPedidoPDF(){
 
  var data= $("#lsDet").html();
  var idpedido= $("#idpedido").val();
  var filename='Pedido '+idpedido;

  createPDF(data,filename);
 
 }




no me sale los formatos css de la tabla, tengo en la cabecera esto:

<style>
 
 
 #APP_Pedido_RPT_Table
 {
  border-collapse: collapse;
  border-bottom-style: solid;
  border-width: 1px;
  border-color:black;
 }
 
 #APP_Pedido_RPT_Table td
 {
  border-left-style: solid;
  border-right-style: solid;
  border-width: 1px;
  border-color:black;
  padding: 8px;
 }
 
 #APP_Pedido_RPT_Table th
 {
  border: 1px solid black;
  padding-top: 12px;
  padding-bottom: 12px;
 }
 
 
</style>




y en el cuerpo esto :




<div style="margin-left:15px;text">
 <p style="text-align:center;font-weight: bold;"> {empresa}
 <br/> {emp_nif}
 <br/> {emp_direccion}
 <br/> {emp_ciupro}
 <br/> {emp_email}
 <br/> Tlfn:{emp_numtelefono} </p>
</div>
 
<div style="margin-left:15px;">
    <br/>
 <span style="font-weight: bold;"> Recepcion Nº: {Numpedido}<br/></span>
 <br/>
 <span style="font-weight: bold;"> Prov: {Proveedor} </span>
  <br/>
  <span>{Direccion} {Ciudad}</span>
   <br/>
    <span> {Telefono} - {e_mail}</span>
 <br/>
    <span style="font-weight: bold;">CIF/NIF: {NIF} </span>
   <span>Fecha: {Fecha|date:DD/MM/YYYY}</span>
</div>
 
<br/><br/>
 
 
<div style="margin-left:15px;">
  <table id="APP_Pedido_RPT_Table">
    <thead>
      <tr>
        <th width="250" class="APP_Pedido_Table"> Descripción </th>
        <th width="75" class="APP_Pedido_Table"> Cant. </th>
        <th width="75" class="APP_Pedido_Table"> Tot. </th>
      </tr>
 </thead>
    <tbody data-ahosql="select idarticulo,articulo,cantidad, precio, round(cantidad*precio,2) total from pedidos_lineas where idpedido={idpedido}"
        data-ahotemplate="gridApp_Pedidos_Prov_Lineas_RPT"
        class="km-widget" />
 
  </table>
</div>
 
<br/>
 
<div style="margin-left:15px;">
 <br/>
    <span><b>Observaciones: </b></span>
   <br/>
  <span>{Observaciones}</span>
   <br/>
</div>
 
 <input style="display:none" type="text" id="idpedido" data-ahofield="idpedido" value="{idpedido}" />
 <input style="display:none" type="text" id="idempleado" data-ahofield="idempleado" value="{idempleado}" />



el pie es el siguiente:

<ul data-role="listview" data-style="inset" class="km-widget km-listview km-list km-listinset">
<li style="text-align:center" >
  <button onclick="enviaPedidoMail('{e_mail}');" class="km-button" title="Enviar por Mail" >Enviar por Mail <span style="margin-left:3px;" class="km-icon km-action"></span></button>
  <button onclick="generaPedidoPDF();" class="km-button" title="Generar PDF">Exportar a PDF <span style="margin-left:2px;"class="km-icon km-organize"></span></button>
</li>
 
</ul>




1 comentario

Hola Ricardo,


 Tienes que meter los estilos dentro del cuerpo en lugar de en la cabecera para que los tenga en cuenta.  

 Ya que la impresión se realiza solo del div del body (del mismo modo que no se imprime la botonera)

 Un saludo, 

Cristina Gómez Soriano

Conectar o Registrarse para publicar un comentario