Por sugestão desta resposta, estou tentando utilizar o normalize.css
pra zerar os estilos entre um require
e outro, mas não tem jeito, a CSS do arquivo posterior interfere completamente no layout do arquivo anterior. Isso não altera o resto da página, o problema é apenas entre eles.
Se coloco apenas um arquivo tudo bem, fica perfeito, mas quando incluo outro dá problema entre eles.
O HTML com o PHP:
<div class="row">
<div class="col-md-2"></div>
<div class="col-md-8">
<?php
require "arquivo1.html";
?>
</div>
<div class="col-md-2"></div>
</div>
<br>
<div class="row">
<div class="col-md-2"></div>
<div class="col-md-8">
<?php
if ($var1 == "incluiarq");
require "arquivo2.html";
?>
</div>
<div class="col-md-2"></div>
</div
O arquivo1.html
(o arquivo2 é basicamente igual, mas com as CSS diferentes):
<link rel="stylesheet" href="_css/normalize.css">
<style type="text/css">
ol{margin:0;padding:0}.c1{widows:2;orphans:2;text-indent:86pt;text-align:justify;direction:ltr}.c6{max-width:468pt;background-color:#ffffff;padding:72pt 72pt 72pt 72pt}.c0{font-size:12pt;font-family:"Times New Roman"}.c5{color:inherit;text-decoration:inherit}.c8{font-size:14pt;font-family:"Times New Roman"}.c2{font-weight:bold}.c4{text-decoration:underline}.c3{height:11pt}.c7{font-style:italic}.title{widows:2;padding-top:0pt;line-height:1.15;orphans:2;text-align:left;color:#000000;font-size:21pt;font-family:"Trebuchet MS";padding-bottom:0pt;page-break-after:avoid}.subtitle{widows:2;padding-top:0pt;line-height:1.15;orphans:2;text-align:left;color:#666666;font-style:italic;font-size:13pt;font-family:"Trebuchet MS";padding-bottom:10pt;page-break-after:avoid}li{color:#000000;font-size:11pt;font-family:"Arial"}p{color:#000000;font-size:11pt;margin:0;font-family:"Arial"}h1{widows:2;padding-top:10pt;line-height:1.15;orphans:2;text-align:left;color:#000000;font-size:16pt;font-family:"Trebuchet MS";padding-bottom:0pt;page-break-after:avoid}h2{widows:2;padding-top:10pt;line-height:1.15;orphans:2;text-align:left;color:#000000;font-size:13pt;font-family:"Trebuchet MS";font-weight:bold;padding-bottom:0pt;page-break-after:avoid}h3{widows:2;padding-top:8pt;line-height:1.15;orphans:2;text-align:left;color:#666666;font-size:12pt;font-family:"Trebuchet MS";font-weight:bold;padding-bottom:0pt;page-break-after:avoid}h4{widows:2;padding-top:8pt;line-height:1.15;orphans:2;text-align:left;color:#666666;font-size:11pt;text-decoration:underline;font-family:"Trebuchet MS";padding-bottom:0pt;page-break-after:avoid}h5{widows:2;padding-top:8pt;line-height:1.15;orphans:2;text-align:left;color:#666666;font-size:11pt;font-family:"Trebuchet MS";padding-bottom:0pt;page-break-after:avoid}h6{widows:2;padding-top:8pt;line-height:1.15;orphans:2;text-align:left;color:#666666;font-style:italic;font-size:11pt;font-family:"Trebuchet MS";padding-bottom:0pt;page-break-after:avoid}
</style>
<p class="c1">
<span class="c2 c8">Loren</span>
</p>
<p class="c1">
<span class="c0"> </span>
</p>
<p class="c1">
<span class="c0">.</span>
</p>
<p class="c1">
<span class="c0"> </span>
</p>
<p class="c1">
<span class="c0">Loren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsum</span> <span class="c0 c2">Loren ipsum</span></p>
<p class="c1">
<span class="c0"> </span>
</p>
<p class="c1">
<span class="c0">Loren ipsumLoren ipsumLoren ipsumLoren ipsum</span>
</p>
<p class="c1">
<span class="c0"> </span>
</p>
<p class="c1">
<span class="c0">Loren ipsum,</span> <span class="c0 c7">data venia,</span>
<span class="c0">Loren ipsumLoren ipsumLoren ipsum</span>
<span class="c0 c2">Loren ipsumLoren ipsumLoren ipsum</span>
</p>
Estes arquivos eram originalmente docs
feitos no google drive, e foram convertidos pra HTML pelo próprio google drive, então ele gera este monte de css, mas de forma surpreendente fica perfeito :-) quando incluo apenas um.
Este que postei acima (arquivo1.html
) é o arquivo inteiro que estou incluindo, eu retirei todo o cabeçalho e as tags de fechamento pra que não interferisse, e se coloco apenas um tudo bem, mas quando coloco o segundo dá problema. Alguma ideia?
style
, na hora de incluir inclua o css referente à cada arquivo.c1{ font-size:14pt; font-family:"Times New Roman"; font-weight:bold}
enquanto no outro é.c1{ widows:2; orphans:2; text-indent:86pt; text-align:justify; direction:ltr
<link rel="stylesheet" href="_css/normalize.css"> <link rel="stylesheet" href="arquivo1.css">