Pessoal estou com um problema de quando mando a impressao ela sai desconfigurada, segue pagina jsp.
Na tela está OK, um exemplo pelo css delimitei o tamanho do input porem na impressao ele sai gigante, outro a div que é uma modal aparece na impressao quando nao deveria estar aparecendo, alguem tem alguma dica ???
<%--
Document : simulador
Created on : 13/09/2010, 15:26:34
Author : estagio.desenv
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<jsp:useBean id="select" class="com.ask.dao.ComandosDao" />
<jsp:useBean id="hora" class="com.ask.trata.Horarios"/>
<jsp:useBean id="tab" class="com.ask.trata.TabHora"/>
<jsp:useBean id="dados" class="com.ask.trata.CriaSimulador"/>
<jsp:useBean id="us" class="com.ask.trata.usuario"/>
<jsp:useBean id="qtd" class="com.ask.trata.Quantidades"/>
<html>
<style>
@page {
size: 8.00in 12.88in;
margin: 30px 20px 15px 35px;
}
</style>
<head>
<link rel="shortcut icon" href="<%=request.getContextPath()%>/img/icon.ico"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ASK! Intranet</title>
</head>
<body onload="data()" id="body">
<!-- Styles -->
<link type='text/css' href='<%=request.getContextPath()%>/css/osx.css' rel='stylesheet' media='screen' />
<link type="text/css" rel="stylesheet" media="screen" href="<%=request.getContextPath()%>/css/simulador.css"/>
<link type="text/css" href="<%=request.getContextPath()%>/css/botoes.css" rel="stylesheet" media="screen" />
<style type="text/css">
a:link {text-decoration: none; color: blue;}
a:visited {text-decoration: none; color: blue;}
a:hover {text-decoration: none; color:green;}
a:active {text-decoration: none; color: blue;}
</style>
<!-- Scripts -->
<script type='text/javascript' src="<%=request.getContextPath()%>/js/Hora.js"></script>
<script type='text/javascript' src='<%=request.getContextPath()%>/js/jquery.js'></script>
<script type='text/javascript' src='<%=request.getContextPath()%>/js/jquery.simplemodal.js'></script>
<script type='text/javascript' src='<%=request.getContextPath()%>/js/osx.js'></script>
<script type='text/javascript' src='<%=request.getContextPath()%>/js/AjaxTipo.js'></script>
<script type='text/javascript' src="<%=request.getContextPath()%>/js/Valida.js"></script>
<script type='text/javascript' src="<%=request.getContextPath()%>/js/AjaxInclusao.js"></script>
<script type='text/javascript' src="<%=request.getContextPath()%>/js/jquery.js"></script>
<div id="Pdf">
<table style="width: 233px; height: 50px; text-align: center; margin-left: auto; margin-right: auto;" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
<img src="<%=request.getContextPath()%>/img/logo.JPG"><br><br>
<form name="form_relogio">
<input type="text" id="data" size="32" readonly>
<input type="text" id="relogio" size="7" readonly>
</form>
</td>
</tr>
</tbody>
</table>
<table style="width:700px; height: 80px; text-align: left; margin-left: auto; margin-right: auto;" border="1" cellpadding="0" cellspacing="1">
<tbody>
<tr style="font-family: Arial;">
<td style="height: 70px; text-align: center; vertical-align: middle;">
<small>
<span style="font-family: Arial; font-weight: bold;">${dados.infos}
</span>
</small>
</td>
</tr>
</tbody>
</table>
<table style="width: 700px; height: 100px; text-align: left; margin-left: auto; margin-right: auto;" border="1" cellpadding="2" cellspacing="2">
<tbody>
<small>
<th class="th">Proposta de Horários</th>
<th class="th">Nrº Ops. Intervalo</th>
<th class="th">Dimensionamento/P.A's</th>
</small>
<tr>
<td style="vertical-align: top; font-family: Arial; font-size: small; font-weight: bold; color:#000000; text-align: center; height: 100px; width: 305px;">
${hora.add}
<br>
<table id="tipo" >
<thead> Carga Horária :</thead>
<tr style="width: 10%; height: 10%">
<td>06:00</td>
<td>06:20</td>
<td>Extra</td>
</tr>
<tr>
<td style="width: 20%">
<input type="radio" name="tipo" id="rd" value="1" onchange="ajaxTipo(this.value)">
</td>
<td style="width: 20%">
<input type="radio" name="tipo" id="rd" value="2" onchange="ajaxTipo(this.value)">
</td>
<td style="width: 20%">
<input type="radio" name="tipo" id="rd" value="3" onchange="ajaxTipo(this.value)">
</td>
</tr>
</table>
<input id="cad" name='osx' value="Incluir" type="button" class='osx demo'>
<!-- Div's Model Inicio (Seleção adicionar horario) -->
<div id="osx-modal-content">
<div id="osx-modal-title">Incluir Horários</div>
<div class="close"><a href="#" class="simplemodal-close">x</a></div>
<div id="osx-modal-data">
<script src="<%=request.getContextPath()%>/js/Valida.js"></script>
<form method="post" action="IncluiHorarios" name="hora">
<b>
<label> Horários </label><br>
<select tabindex="0" id="select" size="8" name="horario" title="Horário conforme legenda !">
${select.select}
</select>
<br><label>Quantidade : </label><input class="input" name="qtd" type="text" maxlength="2" title="Quantidade de P.A's no horário informado !" onchange="val(this.name)">
<input name="insere" id="cad" value="Incluir" type="submit">
<br>
</b>
</form>
</div>
</div>
<!-- Fim das Div's -->
<div id="inclusos">
<table>
<br>
${hora.input}
</table>
</div>
<br><br>
<div id="acumulador">
<table style="vertical-align: top; font-family: Arial; font-size: small; font-weight: bold; color:#000000; text-align: left">
<tbody>
<tr>
<td>
Operadores :
</td>
<td>
<input name="ops" value="${qtd.ops}" size="1" style="height: 12px;" type="text" readonly>
</td>
<tr>
<td>
Folga :
</td>
<td>
<input name="folga" value="${qtd.folga}" size="1" style="height: 12px;" type="text" maxlength="2" onblur="ajaxQtd(this.name)">
</td>
</tr>
<tr>
<td>
Férias :
</td>
<td>
<input name="ferias" value="${qtd.ferias}" size="1" style="height: 12px;" type="text" maxlength="2" onblur="ajaxQtd(this.name)">
</td>
</tr>
<tr>
<td>
Falta :
</td>
<td>
<input name="falta" value="${qtd.falta}" size="1" style="height: 12px;" type="text" maxlength="2" onblur="ajaxQtd(this.name)">
</td>
</tr>
<tr>
<td>
SubTotal :
</td>
<td>
<input name="subtotal" value="${qtd.subTotal}" size="1" style="height: 12px;" type="text" readonly>
</td>
</tr>
<tr>
<td>
<br>
</td>
</tr>
<tr>
<td>
Maternidade :
</td>
<td>
<input name="mat" value="${qtd.mat}" size="1" style="height: 12px;" type="text" maxlength="2" onblur="ajaxQtd(this.name)">
</td>
</tr>
<tr>
<td>
INSS :
</td>
<td>
<input name="inss" value="${qtd.inss}" size="1" style="height: 12px;" type="text" maxlength="2" onblur="ajaxQtd(this.name)">
</td>
</tr>
<tr>
<td>
Total :
</td>
<td>
<input name="total" value="${qtd.total}" size="1" style="height: 12px;" type="text" readonly>
</td>
</tr>
<tr>
<td>
Indice P.A. :
</td>
<td>
<input name="indice" value="${qtd.indPA}" size="5" style="height: 12px;" type="text" readonly>
</td>
</tr>
</tbody>
</table>
</div>
</td>
<td style="width: 200px; text-align: left; vertical-align: top;">
<table style="width: 80%; text-align: center; margin-left: auto; margin-right: auto;">
<tr>
<td>
<div id="tab1">
${tab.tabHora}
</div>
</td>
</tr>
</table>
</td>
<td style="width: 200px; text-align: left; vertical-align: top;">
<table style="width: 80%; text-align: center; margin-left: auto; margin-right: auto;">
<tr>
<td>
<div id="tab2">
${tab.tabHora2}
</div>
</td>
</tr>
</table>
</tr>
</tbody>
</table>
<div id="esc">
<table style="width: 700px; height: 50px; text-align: left; margin-left: auto; margin-right: auto;" border="1" cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td>
<small><label style="font-family: Arial; font-weight: bold;">Total de Operadores classificados por Horário :</label></small><br>
<br><small><label style="font-family: Arial;">${hora.qtdTotal} operdores de 36 Horas Semanais</label></small>
</td>
</tr>
<tr>
<td>
<small><label style="font-family: Arial; font-weight: bold;">Elaborador: ${us.user}</label></small>
<br><br>
<small><label style="font-family: Arial; font-weight: bold;">Observações :</label></small><br>
<textarea cols="80" rows="5" name="obs" title="Campo de observações, limitação 300 caracteres !" onKeyDown="if(this.value.length >= 300){this.value = this.value.substring(0, 300);}" onKeyUp="if(this.value.length >= 300){this.value = this.value.substring(0, 300)}" onchange="ajaxPost(this.name)"></textarea>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<br>
<table style="width: 700px; height: 50px; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<script src="js/Ajax.js" type="text/javascript"></script>
<td style="text-align: center">
<input id="save" type="button" name="imp" value="Imprime" onclick="window.print()">
<input id="save" type="button" name="save" value="Salvar" onclick="save()" >
<input id="exit" type="submit" name="exit" value="Sair" onclick="window.location.href = '<%=request.getContextPath()%>/Refresh'">
</td>
</tr>
</tbody>
</table>
</body>
</html>