I'm trying to put a slide on my site, but when I index the Bootstrap 4 on the page, the slide does not get full screen (does not fill the screen), when I do not index the slide wheel right fill the whole screen like and want, but if I do not use Bootstrap I will not be able to add certain elements on the page that need it, follow the code.
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>SLIDER DEVMEAN</title>
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/slider.css">
<link rel="stylesheet" type="text/css" media="screen" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous" />
</head>
<body>
<div class="container slide-principal">
<!-- INICIO DO SLIDER -->
<section class="slider">
<div class="slider_box">
<article class="slider_item active" slider-bg="imagens/casa1.jpg">
<div class="slider_content">
<h1>1 TITULO DO SLIDE SEMÂNTICO</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos tempore accusantium mollitia dignissimos quidem explicabo, recusandae. Assumenda, nemo voluptatum accusamus!</p>
</div>
</article>
<article class="slider_item" slider-bg="images/slide2.jpg">
<div class="slider_content">
<h1>2 JAVASCRIPT NA VEIA</h1>
<p>Desenvolvemos aplicativos web para as necessidades do seu negócio.</p>
</div>
</article>
<article class="slider_item" slider-bg="images/slide3.jpg">
<div class="slider_content">
<h1>3 UM TITULO QUALQUER</h1>
<p>Somos apaixonados pelo que fazemos, vamos introduzir e fixar a imagem de sua empresa destacando seus produtos e serviços na Internet, com muito talento, tecnologia e comprometimento.</p>
</div>
</article>
</div>
<div class="slider-prev"><</div>
<div class="slider-next">></div>
</section>
<!-- FIM DO SLIDER -->
</div>