1
At the suggestion of this answer, I’m trying to use the normalize.css to reset the styles between one require and another, but it’s hopeless, the CSS of the later file completely interferes with the layout of the previous file. This does not alter the rest of the page, the problem is only between them.
If I put only one file all right, it’s perfect, but when I include another gives problem between them.
HTML with 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
The arquivo1.html (file 2 is basically the same, but with different CSS):
<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>
These files were originally docs made in google drive, and were converted to HTML by google drive itself, so it generates this lot of css, but surprisingly it is perfect :-) when I include only one.
This one I posted above (arquivo1.html) is the entire file I’m including, I removed all the header and closing tags so it wouldn’t interfere, and if I put only one all right, but when I put the second one it gives problem. Any idea?
removes inline css from pages and creates a file for each page
style, when including include include the css for each file– Erlon Charles
@Erloncharles Do you say create a CSS file with the formatting that comes in the HTML file? I tried this but it didn’t work, it keeps overwriting the CSS’s. Or do you say create a single css file and apply to everyone according to the classes? The problem, if that is the case, is that it creates different attributes for the classes... For example . C1 in a file is
.c1{
 font-size:14pt;
 font-family:"Times New Roman";
 font-weight:bold}while in the other is.c1{
 widows:2;
 orphans:2;
 text-indent:86pt;
 text-align:justify;
 direction:ltr– gustavox
In time: I tested using external files with and without normalizecss... With normalize used so at the beginning of the file
<link rel="stylesheet" href="_css/normalize.css"> <link rel="stylesheet" href="arquivo1.css">– gustavox
Just for the record, I even found a <s>way</s> gambiarra to get around this, which was using a google drive plugin to merge all the files into one, and then generated only one HTML file. So I could use this CSS for all the individual files (after separating the merged file again), but you know what, I thought it was gonna suck, and I decided to rewrite everything, using a few tags, and a little CSS, after all, it’s just a text file, there’s no point in using all this CSS and this crazy HTML that google drive generates.
– gustavox