[Bootstrap3] Probleme navbar- responsiv.

Bonjour à tous,

J'ai un soucis et je ne sais pas d'où il peut venir. Je vous explique :
Je fais en ce moment mon CV en ligne.
J'utilise donc Bootstrap, j'ai mis en place une navbar, qui lorsqu'on réduit la taille du navigateur, se réduit d'elle même.
Donc jusqu'ici en terme de responsive ca me va.

Le probleme c'est que lorsque je tente de vérifier sur ma tablette ou sur smartphone, la navbar ne se réduit pas :s , du coup ca décale et ca fait pas beau.

Quelqu'un aurait une idée?

<div class="navbar navbar-default navigateur " role="navigation">
                <div class="container-fluid navigateur ">
                    <div class="navbar-header navigateur">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navigateur1">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a class="navbar-brand" href="#">Mes infos</a>
                    </div> 

                    <div class="collapse navbar-collapse " id="navigateur1">
                        <ul class="nav navbar-nav navigateur">
                            <li><a href="competences">Compétences</a></li>
                            <li><a href="experiences">Expériences</a></li>
                            <li><a href="etudes-formations">Etudes & Formations</a></li>
                            <li><a href="loisirs">Loisirs</a></li>
                        </ul>
                    </div><!--/.nav-collapse -->
                </div><!--/.container-fluid -->
            </div>