I have the following page which is to print an OS report, it is exactly the way I need it, but when I print this, I lose the formatting of the css, how do I print without losing the css layout
<?php //CONEXAO header('Content-Type: text/html; charset=utf-8'); $HOST ="192.168.0.29"; $USER = "root"; $PASS = ""; $DB = "ocomon_rc6";
$CONN = mysql_connect($HOST,
$USER,
$PASS) or die ("O servidor não responde!"); $CONNECT = mysql_select_db($DB,$CONN) or die ("Não foi possivel conectar-se ao banco de dados!");
mysql_query("SET NAMES 'utf8'"); mysql_query('SET character_set_connection=utf8'); mysql_query('SET character_set_client=utf8'); mysql_query('SET character_set_results=utf8'); //FINAL DA CONEXAO
?> <!DOCTYPE html> <html> <head> <title></title> <link href=bootstrap/css/bootstrap.min.css rel=stylesheet> </head> <body> <nav class="navbar navbar-default"> <div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="index.php">
VOLTAR
</a>
</div> </div> </nav> <div class="container"> <?php $VarStatus = $_POST['status']; $VarSetor = $_POST['setor'];
$QueryCons = mysql_query(" SELECT
o.numero AS CHAMADO,
p.problema AS PROBLEMA,
o.descricao AS DESCRICAO,
o.contato AS CONTATO,
o.telefone AS TELEFONE,
o.data_abertura AS DATA_DE_ABERTURA,
TIMESTAMPDIFF (HOUR, str_to_date(data_abertura,'%Y-%m-%d'), CURDATE()) as HORAS_EM_ABERTO,
i.inst_nome AS UNIDADE,
a.sistema AS AREA,
l.local AS SETOR,
u.nome AS TECNICO,
ua.nome AS ABERTO_POR,
s.status AS STATUS
/*sls.slas_tempo AS TEMPO_DE_SOLUCAO*/ FROM
ocorrencias AS o
LEFT JOIN
sistemas AS a ON a.sis_id = o.sistema
LEFT JOIN
localizacao AS l ON l.loc_id = o.local
LEFT JOIN
instituicao AS i ON i.inst_cod = o.instituicao
LEFT JOIN
usuarios AS u ON u.user_id = o.operador
LEFT JOIN
usuarios AS ua ON ua.user_id = o.aberto_por
LEFT JOIN
'status' AS s ON s.stat_id = o.status
LEFT JOIN
status_categ AS stc ON stc.stc_cod = s.stat_cat
LEFT JOIN
problemas AS p ON p.prob_id = o.problema
LEFT JOIN
sla_solucao AS sls ON sls.slas_cod = p.prob_sla
LEFT JOIN
prioridades AS pr ON pr.prior_cod = l.loc_prior
LEFT JOIN
sla_solucao AS slr ON slr.slas_cod = pr.prior_sla
LEFT JOIN
script_solution AS sol ON sol.script_cod = o.oco_script_sol
LEFT JOIN
prior_atend AS prioridade_atendimento ON prioridade_atendimento.pr_cod = o.oco_prior
WHERE
a.sistema = '$VarSetor'
AND o.status = '$VarStatus'")
or die(mysql_error());
if(empty($QueryCons))
{
echo "Nenhum registro encontrado.";
}
while ($row = mysql_fetch_array($QueryCons)) { echo" <div class='panel panel-default'> <div class='panel-body'>
<div class='row'> <div class='col-md-3'> <p>NUMERO: <p>DATA: <p>ATENDIMENTO: <p>NOME LOJA: <p>CONTATO: <p>RAMAL: <p>USUARIO: </div>
<div class='col-md-3'> <p> ".$row['CHAMADO']." <p> ".$row['DATA_DE_ABERTURA']." <p> ".$row['AREA']." <p> ".$row['UNIDADE']." <p> ".$row['CONTATO']." <p> ".$row['TELEFONE']." <p> ".$row['ABERTO_POR']." </div>
<div class='col-md-6'> <p>PROBLEMA: ".$row['PROBLEMA']." <p>DESCRIÇÃO: <p><h3>".$row['DESCRICAO']."</h3> </div>
</div>
<hr style='width: 100%; color: black; height: 1px; background-color:black;'/>
<div class='row'>
<div class='col-md-6'> <p>ASSINATURA:____________________ </div
<div class='col-md-6'> <p>OBSERVAÇÃO:_________________________________________________________ </div>
</div>
<div class='row'> <center> <div class='col-md-4'> <p>NOME USUÁRIO:____________________ </div>
<div class='col-md-4'> <p>ATENDIMENTO EM:______/______/________ </div> <div class='col-md-4'> <p>TÉCNICO:____________________ </div> </center> </div>
</div> "; } ?>
<script src=jquery/jquery-3.1.1.min.js></script> <script src=bootstrap/js/bootstrap.min.js></script> </body> </html>
How it works with CSS:
WhenIPrint: