Bom dia, estou com um problema de conflito de estilos, criei um rodape em um outro arquivo e ai quando dou um 'require_once' pro meu index, o estilo se sobscreve e a pagina até perde varias funções, o arquivo do rodape é o seguinte:
`
<head>
<link rel="stylesheet" id="compiled.css-css"
href="https://mdbootstrap.com/wp-content/themes/mdbootstrap4/css/compiled-4.19.1.min.css?ver=4.19.1"
type="text/css" media="all">
</head>
<body>
<footer class="page-footer font-small special-color-dark pt-4">
....
</footer>
</body>
```
E o index no qual estou tentando colocar ele é:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<meta http -equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.16.0/dist/bootstrap-table.min.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body id="body">
<div class="table responsive">
<div class="container">
<table id="tabela_dividas"><br>
<?php
if (is_admin()) { ?>
<h2>Gerar dividas</h2>
<p><button type="button" class="btn btn-danger" onclick="abriModalDividas()">
Gerar Divida
</button></p>
<thead>
<tr>
<th scope="col" data-field="id_cad" data-visible="false"></th>
<th scope="col" data-field="divida" data-checkbox="true"></th>
<th scope="col" data-field="nome">Nome</th>
<th scope="col" data-field="cpf">CPF ou CNPJ</th>
<th scope="col" data-field="tipo_negocio">tipo de negocio</th>
</tr>
</thead>
<?php } else { ?>
<h2>Dividas</h2>
<p><button type="button" class="btn btn-danger" onclick="abriModalDividas()">
Negociar dividas
</button></p>
<thead>
<tr>
<th scope="col" data-field="id_dividas" data-visible="false"></th>
<th scope="col" data-field="divida" data-checkbox="true"></th>
<th scope="col" data-field="nome">Nome</th>
<th scope="col" data-field="tipo_divida">Tipo de dividas</th>
<th scope="col" data-field="valor">Valor</th>
<th scope="col" data-field="status">Status</th>
</tr>
</thead>
<?php
}
?>
</table>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.5.0.min.js" integrity="sha256-xNzN2a4ltkB44Mc/Jz3pT4iU1cmeR0FkXs4pru/JxaQ=" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://unpkg.com/bootstrap-table@1.16.0/dist/bootstrap-table.min.js"></script>
<script src="jQuery-Mask-Plugin-master/src/jquery.mask.js"></script>
<script src="tata-master/dist/tata.js"></script>
<?php require_once 'rodape.html'?>
</body>
Como consigo resolver isso? Imagino que deve haver algum jeito de isolar esse link que está chegando do rodape pra um não sobscrever o outro ou sla oque.