Beug bootstrap ou navigateur

Bonsoir,
Je travaille en ce moment sur le squelette de mon site avec bootstrap et quand j'éxècute mon fichier php la barre pou défilé de bas en haut à droite disparait et tous mon code beug et je ne sais pas pourquoi (Ps: je suis sur firefox).
Voici mon code :

<!DOCTYPE html>
<html lang="fr">
<head>

<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!--concerne IE-->
<meta name="viewport" content="width=device-width, initial-scale=1"> <!--concerne portable-->

<title> Resline </title>

<link href="bootstrap3/css/bootstrap.css" rel="stylesheet">
    <link href="bootstrap3/css/personalisation_aprecus.css" rel="stylesheet">

</head>

<body>

<!-- Menu -->

<nav class="navbar navbar-inverse">
    <div class="container-fluid">
        <div class="navbar-header"> <!-- titre sur le Menu-->
            <a class="navbar-brand" href="#" rel="nofollow noopener noreferrer" target="_blank"> Resline </a>
        </div>
        <ul class="nav navbar-nav"> <!--met sur une ligne-->
            <li class="active"> <a href="#" rel="nofollow noopener noreferrer" target="_blank"> Restaurant </a> </li>
            <li> <a href="#" rel="nofollow noopener noreferrer" target="_blank"> Service </a></li>
            <li> <a href="#" rel="nofollow noopener noreferrer" target="_blank"> Pour en savoir plus </a></li>
        </ul>

        <form class="navbar-form navbar-right inline-form"> <!--recherche-->

            <div class="form-group">

                <input type="search" class="input-sm form-control" placeholder="Recherche">

                <button type="submit" class="btn btn-primary btn-sm"><span class="glyphicon glyphicon-eye-open"></span> Chercher</button>

            </div>

        </form>
    </div>

</nav>

<!-- sidebard -->

<div class="container">
    <div class="row">
       <div class="col-lg-3" >
           <ul class="list-group">
               <li class="list-group-item"> Accueil </li>
               <li class="list-group-item"> Article  </li>
               <li class="list-group-item"> Commentaire </li>
           </ul>
       </div>

<!-- Slider -->

        <div class="col-lg-9">
            <div id="carousel" class="carousel slide" data-ride="carousel">

                <div class="carousel-inner">

                    <div class="item active"> <img alt="" src="image/Restaurant_deux.jpg"></div>

                    <div class="item"> <img alt="" src="image/Restaurant_deux.jpg"></div>

                    <div class="item"> <img alt="" src="image/Restaurant_3.jpg"></div>

                </div>

                <a class="left carousel-control" href="#carousel" rel="nofollow noopener noreferrer" target="_blank" data-slide="prev">

                    <span class="glyphicon glyphicon-chevron-left"></span>

                </a>

                <a class="right carousel-control" href="#carousel" rel="nofollow noopener noreferrer" target="_blank" data-slide="next">

                    <span class="glyphicon glyphicon-chevron-right"></span>

                </a>

            </div>

        </div>
    </div>
</div>

<!-- Article -->

<!-- footer -->

<script src="bootstrap3/js/bootstrap.js"></script>
<script src="bootstrap3/js/bootstrap.min.js"></script>
<script>
    $(function () {
        $('.carousel').carousel({ interval: 2000 });
        $('#first').click(function() { $('.carousel').carousel(0); });
        $('#previous').click(function() { $('.carousel').carousel('prev'); });
        $('#pause').click(function() { $('.carousel').carousel('pause'); });
        $('#play').click(function() { $('.carousel').carousel('cycle'); });
        $('#next').click(function() { $('.carousel').carousel('next'); });
        $('#last').click(function() { $('.carousel').carousel(2); });
    });
</script>

</body>
</html>