Foros del Web » Creando para Internet » CSS »

Imprimir contenido completo en css para imprimir

Estas en el tema de Imprimir contenido completo en css para imprimir en el foro de CSS en Foros del Web. Saludos; Tengo una tabla creada en html la cual es muy ancha, he creado un css para imprimirla en horizontal y para que solo se ...
  #1 (permalink)  
Antiguo 27/06/2011, 09:17
Avatar de veriyo  
Fecha de Ingreso: junio-2010
Mensajes: 80
Antigüedad: 6 años, 9 meses
Puntos: 0
Imprimir contenido completo en css para imprimir

Saludos;

Tengo una tabla creada en html la cual es muy ancha, he creado un css para imprimirla en horizontal y para que solo se vea la tabla sin los demas elementos que componen el archivo, lo que ocurre es que como es tan ancha no se imprime del todo, se corta casi ala mitad, ¿como podria hacer para que la impresion continue?

aqui os dejo el css

Código HTML:
.contenido_historicos_medidas {
overflow:visible;
writing-mode: tb-rl;
height: 100%;
margin: 3% 0%;
}
.cabecera_historicos_medidas {
overflow:visible;
writing-mode: tb-rl;
height: 100%;
margin: 3% 0%;
}
Muchas gracias!!!!
  #2 (permalink)  
Antiguo 27/06/2011, 10:02
 
Fecha de Ingreso: diciembre-2010
Mensajes: 459
Antigüedad: 6 años, 3 meses
Puntos: 21
Respuesta: Imprimir contenido completo en css para imprimir

ponle width:xxx px

por ejemplo width:120px;
y el alto tb en vez de porcentaje puedes definirlo por pixeles

Saludos
  #3 (permalink)  
Antiguo 27/06/2011, 10:32
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 9 años, 9 meses
Puntos: 538
Respuesta: Imprimir contenido completo en css para imprimir

¿Px para impresión? Yo no lo recomendaría.

Introducción a los medios paginados.

Para lograr resultados satisfactorios,hay que definir algo más que un par de clases, comenzando por el tamaño y orientación de la página de impresión (@page).
  #4 (permalink)  
Antiguo 28/06/2011, 02:47
Avatar de veriyo  
Fecha de Ingreso: junio-2010
Mensajes: 80
Antigüedad: 6 años, 9 meses
Puntos: 0
Respuesta: Imprimir contenido completo en css para imprimir

gracias por responder, pero he probado a ponerle el ancho en pixeles y porcentaje y no me funciona, se sigue cortando el contenido..... tambien probe a ponerle ala tabla style="page-break-before:always" y lo que hace es ponerme la tabla en otra pagina pero se sigue cortando..... ya que es muy ancha, en pantalla tiene 2552px, podria partir esa tabla de alguna forma?? para que imprima todo el ancho??

estoy un poco verde en css, ahora me estudiare lo que me pasaste kseso?, tiene muy buena pinta, gracias
  #5 (permalink)  
Antiguo 30/06/2011, 03:21
Avatar de veriyo  
Fecha de Ingreso: junio-2010
Mensajes: 80
Antigüedad: 6 años, 9 meses
Puntos: 0
Respuesta: Imprimir contenido completo en css para imprimir

a alguien se le ocurre algo?? he probado en convertir los pixeles a puntos pero tampoco me imprime la tabla completa.....
  #6 (permalink)  
Antiguo 30/06/2011, 04:49
 
Fecha de Ingreso: diciembre-2010
Mensajes: 459
Antigüedad: 6 años, 3 meses
Puntos: 21
Respuesta: Imprimir contenido completo en css para imprimir

Cita:
Iniciado por veriyo Ver Mensaje
a alguien se le ocurre algo?? he probado en convertir los pixeles a puntos pero tampoco me imprime la tabla completa.....
Podrias poner tu codigo html?

Saludos
  #7 (permalink)  
Antiguo 30/06/2011, 05:19
Avatar de veriyo  
Fecha de Ingreso: junio-2010
Mensajes: 80
Antigüedad: 6 años, 9 meses
Puntos: 0
Respuesta: Imprimir contenido completo en css para imprimir

aqui va el html de la cabecera de la tabla, no te pongo todo el codigo, porque que no cabe....

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  4. <title>Documento sin t&iacute;tulo</title>
  5. <link href="eficiencia_energetica/alimentacion_electrica/historicos_alimentacion/estilos_tabla.css" rel="stylesheet" type="text/css"/>
  6. <link href="estilos_basicos/estilos.css" rel="stylesheet" type="text/css"/>
  7.  
  8. <link href="eficiencia_energetica/alimentacion_electrica/historicos_alimentacion/imprimir.css"rel="stylesheet" type="text/css" media="print"/>
  9.  
  10. <style type="text/css">
  11. <!--
  12. #cp_cabecera_historicos_medidas_alimentacion {  position:absolute;
  13.     left:0px;
  14.     top:0px;
  15.     width:378px;
  16.     height:105px;
  17.     z-index:5;
  18.     visibility: visible;
  19. }
  20. -->
  21. </head>
  22.  
  23. <div id="cp_cabecera_historicos_medidas_alimentacion">
  24.   <div class="cabecera_historicos_medidas_alimentacion" id="c">
  25.     <table width="7052" height="75" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000" class="F_arial_11_bold_centrado_negro"
  26. style="border-collapse:collapse">
  27.       <tr>
  28.         <td width="73" bgcolor="#99CCFF">FASE NEUTRO <br />
  29.           L1 </td>
  30.         <td width="73" bgcolor="#99CCFF">FASE NEUTRO <br />
  31.           L2</td>
  32.         <td width="73" bgcolor="#99CCFF">FASE NEUTRO <br />
  33.           L3 </td>
  34.         <td width="73" bgcolor="#99CCFF">FASE<br />
  35.           FASE <br />
  36.           L1 </td>
  37.         <td width="73" bgcolor="#99CCFF">FASE <br />
  38.           FASE L2</td>
  39.         <td width="73" bgcolor="#99CCFF">FASE<br />
  40.           FASE L3</td>
  41.         <td width="73" bgcolor="#99CCFF">DISTORSI&Oacute;N TOTAL L1 (THD) </td>
  42.         <td width="73" bgcolor="#99CCFF">DISTORSI&Oacute;N TOTAL L2 (THD)</td>
  43.         <td width="73" bgcolor="#99CCFF">DISTORSI&Oacute;N TOTAL L3 (THD)</td>
  44.         <td width="73" bgcolor="#99CCFF">FRE-<br />
  45.           CUENCIA L1 </td>
  46.         <td width="73" bgcolor="#99CCFF">FRE-<br />
  47.           CUENCIA L2</td>
  48.         <td width="73" bgcolor="#99CCFF">FRE-<br />
  49.           CUENCIA L3 </td>
  50.         <td width="73" bgcolor="#99CCFF">CORRIENTE L1 </td>
  51.         <td width="73" bgcolor="#99CCFF">CORRIENTE L2</td>
  52.         <td width="73" bgcolor="#99CCFF">CORRIENTE L3 </td>
  53.         <td width="73" bgcolor="#99CCFF">CORRIENTE  NEUTRO<br />
  54.           L1</td>
  55.         <td width="73" bgcolor="#99CCFF">CORRIENTE  NEUTRO<br />
  56.           L2</td>
  57.         <td width="73" bgcolor="#99CCFF">CORRIENTE  NEUTRO<br />
  58.           L3</td>
  59.         <td width="73" bgcolor="#99CCFF">DISTOR.<br />
  60.           TOTAL CORRIENTE<br />
  61.           (THD) L1 </td>
  62.         <td width="73" bgcolor="#99CCFF">DISTOR.<br />
  63.           TOTAL CORRIENTE
  64.           (THD) L2</td>
  65.         <td width="73" bgcolor="#99CCFF">DISTOR.<br />
  66.           TOTAL CORRIENTE
  67.           (THD) L3</td>
  68.         <td width="73" bgcolor="#99CCFF">POTEN. ACTIVA L1 </td>
  69.         <td width="73" bgcolor="#99CCFF">POTEN. ACTIVA L2</td>
  70.         <td width="73" bgcolor="#99CCFF">POTEN. ACTIVA L3</td>
  71.         <td width="73" bgcolor="#99CCFF">POTEN. CAPA-<br />
  72.           CITIVA L1</td>
  73.         <td width="73" bgcolor="#99CCFF">POTEN. CAPA-<br />
  74.           CITIVA L2</td>
  75.         <td width="73" bgcolor="#99CCFF">POTEN. CAPA-<br />
  76.           CITIVA L3</td>
  77.         <td width="73" bgcolor="#99CCFF">POTEN. INDUCTIVA L1</td>
  78.         <td width="73" bgcolor="#99CCFF">POTEN. INDUCTIVA L2</td>
  79.         <td width="73" bgcolor="#99CCFF">POTEN. INDUCTIVA L3</td>
  80.         <td width="73" bgcolor="#99CCFF">POTEN. APARENTE L1</td>
  81.         <td width="73" bgcolor="#99CCFF">POTEN. APARENTE L2</td>
  82.         <td width="73" bgcolor="#99CCFF">POTEN. APARENTE L3</td>
  83.         <td width="73" bgcolor="#99CCFF">FACTOR DE POTENCIA L1 </td>
  84.         <td width="73" bgcolor="#99CCFF">FACTOR DE POTENCIA L2</td>
  85.         <td width="73" bgcolor="#99CCFF">FACTOR DE POTENCIA L3</td>
  86.         <td width="73" bgcolor="#99CCFF">POTEN. INDUCTIVA L3</td>
  87.         <td width="73" bgcolor="#99CCFF">CONSENSO phi L1 </td>
  88.         <td width="73" bgcolor="#99CCFF">CONSENSO phi L2</td>
  89.         <td width="73" bgcolor="#99CCFF">CONSENSO phi L3</td>
  90.         <td width="73" bgcolor="#99CCFF">ENERG. ACTIVA L1 </td>
  91.         <td width="73" bgcolor="#99CCFF">ENERG. ACTIVA L2</td>
  92.         <td width="73" bgcolor="#99CCFF">ENERG. ACTIVA L3</td>
  93.         <td width="73" bgcolor="#99CCFF">ENERG. CAPA-CITIVA L1</td>
  94.         <td width="73" bgcolor="#99CCFF">ENERG. CAPA-CITIVA L2</td>
  95.         <td width="73" bgcolor="#99CCFF">ENERG. CAPA-CITIVA L3</td>
  96.         <td width="73" bgcolor="#99CCFF">ENERG. INDUCTIVA L1 </td>
  97.         <td width="73" bgcolor="#99CCFF">ENERG. INDUCTIVA L2</td>
  98.         <td width="73" bgcolor="#99CCFF">ENERG. INDUCTIVA L3</td>
  99.         <td width="73" bgcolor="#99CCFF">ARM&Oacute;NICO FUNDA-MENTAL L1 </td>
  100.         <td width="73" bgcolor="#99CCFF">ARM&Oacute;NICO FUNDA-MENTAL L2 </td>
  101.         <td width="73" bgcolor="#99CCFF">ARM&Oacute;NICO FUNDA-MENTAL L3 </td>
  102.         <td width="73" bgcolor="#99CCFF">ARM&Oacute;NICO<br />
  103.           2 L1 </td>
  104.        <!-- como la tabla es tan ancha no me cabe todo el codigo aqui, pero para que te hagas una idea la tabla tiene 94 columnas -->
  105.       </tr>
  106.     </table>
  107.   </div>
  108. </div>
  109. </body>
  110. </html>
  #8 (permalink)  
Antiguo 30/06/2011, 09:29
 
Fecha de Ingreso: diciembre-2010
Mensajes: 459
Antigüedad: 6 años, 3 meses
Puntos: 21
Respuesta: Imprimir contenido completo en css para imprimir

Si aplicas el estilo a los td, es decir:

<td class="prueba">

y en el css

Código HTML:
Ver original
  1. td.prueba{
  2.  
  3.    width:80em;
  4.    height:auto;
  5.  
  6. }

o

Código HTML:
Ver original
  1. td.prueba{
  2.  
  3.    width:auto;
  4.    height:auto;
  5.  
  6. }

Prueba y me cuentas

Última edición por sirdaiz; 30/06/2011 a las 09:37
  #9 (permalink)  
Antiguo 01/07/2011, 04:23
Avatar de veriyo  
Fecha de Ingreso: junio-2010
Mensajes: 80
Antigüedad: 6 años, 9 meses
Puntos: 0
Respuesta: Imprimir contenido completo en css para imprimir

gracias por responder pero no funciona!! jooooo.

Estoy pensando en buscar algun programa que me convierta ese archivo html en pdf a ver si asi ala hora de imprimir me lo coje todo..... sabes de algun conversor??

gracias de nuevo
  #10 (permalink)  
Antiguo 01/07/2011, 04:39
Avatar de veriyo  
Fecha de Ingreso: junio-2010
Mensajes: 80
Antigüedad: 6 años, 9 meses
Puntos: 0
Respuesta: Imprimir contenido completo en css para imprimir

perdona sirdaiz pero si funciona, ya que con ese estilo cambio el ancho de los td lo que pasa es que la tabla es muy ancha, en pantalla mide 7052px y claro no cabe en un A4 horizontal..... una posible solución seria partir esa tabla pero nose si esto se puede hacer....

Etiquetas: completo, contenido
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 23:28.