Como faço para que o footer aí utilize toda a tela?
Obs.: já usei width 100%; já usei um class=“container-fluid” e nada vai
<footer>
<div class="footer-copyright text-center" id="rodapeinicial">
<p>Forte Boi Indústria de Alimentos LTDA</p>
</div>
</footer>
css:
#rodapeinicial{
margin-top: 40px;
height: 50px;
width: 100% !important;
background: linear-gradient(to right,#27ae60,#20bf6b);
}
#rodapeinicial p{
font-size: 1em !important;
padding-top: 10px;
color:#fff;
}
Mike
#2
Inspeciona a página e ve quais atributos a classe footer-copyright gera.
Mike
#4
Eu não consigo acessar esse link
tenta agora, o servidor é meio lento. deixa o link carregando.
Mike
#6
Eu acho que não é nem isso, a empresa aqui bloqueia o acesso a alguns tipos de site
<!DOCTYPE html>
<html lang="PT-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Titulo Empresa -->
<title>Frigorífico Forte Boi Indústria de Alimentos LTDA</title>
<!-- Bootstrap Responsive -->
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<!-- Bootstrap CSS -->
<link href="css/bootstrap.css" rel="stylesheet">
<!-- Meu CSS -->
<link href="css/style.css" rel="stylesheet">
<!-- Jquery-->
<script src="js/jquery.js"></script>
<!-- Script -->
<script src="js/bootstrap.js"></script>
</head>
<!-- Corpo-->
<body>
<div class="container-fluid" id="iniciocontato">
<div class="row"><div class="col-xs-12 col-sm-12 col-md-12">
<span class="hidden-xs">Localização: Fundão-ES, BR-101, KM-228  |  Telefone: (27) 3267-1144</span></div>
</div>
</div>
<div class="text-center" id="logoempresa">
<a href="index.html"><img src="img/logoforteboi.png" class="img-fluid" alt="Imagem responsiva"></a>
</div>
<nav class="navbar navbar-expand-lg navbar-light bg-light" >
<a class="navbar-brand" href="#"> Frigorífico Forte Boi</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav" >
<ul class="navbar-nav" >
<li class="nav-item active">
<a class="nav-link" href="index.html">Início <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="catalogo.html">Catálogo</a>
</li>
<li class="nav-item">
<a class="nav-link" href="empresa.html">Empresa</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="qualidade.html">Qualidade</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="produtor.html">Produtor</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="logistica.html">Logística</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="ambiente.html">Meio Ambiente</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="boleto.html">2ª Via do Boleto</a>
</li>
</ul>
</div>
</nav>
<!--fim menu-->
<!-- Slider-->
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src="img/empresa.jpg" alt="First slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="img/frota.jpg" alt="Second slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="img/produtor.jpg" alt="Third slide">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
<div class="container-fluid" id="imgboiindex">
<img src="img/boi.png" class="img-responsive" alt="Boi">
<button id="catalogoon" type="button" class="btn btn-outline-light">Acessar o Catálogo Online</button> <button id="catalogooff" type="button" class="btn btn-outline-light">Catálogo em PDF</button>
</div>
<div class="container-fluid" id="indexboleto">
<div class="row">
<div class="col">
<h4>2ª VIA DO BOLETO</h4>
<h5>Comodidade, praticidade e agilidade</h5>
<p>Emita boletos vencidos com os eventuais encargos atualizados</p>
<button type="button" class="btn btn-outline-light">Acessar</button>
</div>
</div>
</div>
<div class="container-fluid" id="containercontato">
<div class="row">
<div class="col">
<h4 style="text-align:center;">Contato</h4>
<p style="text-align:center;">(27) 3267-1144</p>
</div>
</div>
<div class="container" id="containercontatosetor">
<div class="row">
<div class="col-12 col-md-4" id="coluna1">
<h5 style="text-align:center;">Vendas</h5>
<p><strong>Ramal:</strong> 222 - 219 - 229 - 225<p>
<p><strong>E-mail:</strong> vendas@frigorificoforteboi.com.br</p>
</div>
<div class="col-12 col-md-4" id="coluna2">
<h5 style="text-align:center;">Compras</h5>
<p><strong>Ramal:</strong> 230<p>
<p><strong>E-mail:</strong> compras@frigorificoforteboi.com.br</p>
</div>
<div class="col-12 col-md-4" id="coluna3">
<h5 style="text-align:center;">Financeiro</h5>
<p><strong>Ramal:</strong> 214<p>
<p><strong>E-mail:</strong> financeiro@frigorificoforteboi.com.br</p>
</div>
</div>
</div>
<section class="mapas">
<iframe src="https://www.google.com/maps/embed?pb=!1m10!1m8!1m3!1d3750.9834572197688!2d-40.410072875545346!3d-19.92510193391986!3m2!1i1024!2i768!4f13.1!5e0!3m2!1spt-BR!2sbr!4v1535083298799" width="100%" height="100%" frameborder="0" style="border:0" allowfullscreen>
</iframe>
</section>
<script type="text/javascript">
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/5ba0f2fec666d426648ade5d/default';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
</script>
<!--End of Tawk.to Script-->
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<!-- Copyright -->
<footer>
<div class="footer-copyright text-center" id="rodapeinicial">
<p>Forte Boi Indústria de Alimentos LTDA</p>
</div>
</footer>
<!-- Footer -->
</body>
</html>
Mike
#8
container-fluid tem um padding-left e right de 15px
Coloca o seu footer pra fora do container
Não sei se foi proposital ou não, mas você não fechou o container-fluid
1 curtida
Certinho, resolveu, valeu! 
