Erreur taille du site

Chooper01

Chooper01 Le 8 juillet 2017 à 22:10 (Édité le 25 janvier 2019 à 17:53)

Bonsoir, 
Donc voila ayant abandonné le web durant une très longue période dû à mes études j'ai décidé de reprendre ou je mettais arrêté ! 

Bon ça fait au moins 2 heures que je cherche le soucis mais je ne trouve pas, enfaîte quand nous cliquons sur notre pseudo sur la page nous avons un petit menu qui apparaît ou nous pouvons nous déconnecté ou autre mais le soucis le menus n'est pas convenable je vous mets un screen pour être plus clair !

http://hpics.li/fc90606
Ce qui est assez bizarre je vous mets mon code + css

Html :
<ul class="nav navbar-nav pull-right">
                    <?php if (isset($_SESSION['id'])) { ?>
                    <li class="dropdown">
                             <a class=" police dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><?php echo $_SESSION['pseudo'];  ?><span class="caret"></span></a>
                            <ul class=" police dropdown-menu">
                                <li><a href="profil.php">Mon profil</a></li>
                                <li><a href="#">Message privé</a></li>
                                <li role="separator" class="divider"></li>
                                <li><a href="deco.php">Déconnexion</a></li>
                            </ul>
                            <?php } 
                            else { ?>
                            <li class="police"><a href="connexion.php">Connexion</a></li>
                            <li><a href="inscription.php">Inscription</a></li>
                            <?php } ?>
                        </li>
                    </ul>
CSS :
body{
  margin:auto;
  width: 100%;
  height: 100% ;
  background-color: rgba(92, 209, 182, 0.09);
}
.barre{
  background-color: #CEF2F9;
}
.police{
  font-family: cursive;
}
.navbar, .dropdown-menu{
background:rgba(255,255,255,0.25);
border: none;
}
.nav>li>a, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .dropdown-menu>li>a, .dropdown-menu>li{
  border-bottom: 3px solid transparent;
}
.nav>li>a:focus, .nav>li>a:hover,.nav .open>a, .nav .open>a:focus, .nav .open>a:hover, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{
  border-bottom: 3px solid transparent;
  background: none;
}
.dropdown-menu{
    -webkit-box-shadow: none;
    box-shadow:none;
}
.navbar a, .dropdown-menu>li>a, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .navbar-toggle{
 color: #fff;
}
.dropdown-menu{
    -webkit-box-shadow: none;
    box-shadow:none;
}
.nav li:hover:nth-child(8n+1){
  border-bottom: #C4E17F 3px solid;
}
.nav li:hover:nth-child(8n+2){
  border-bottom: #FFC300 3px solid;
}
.nav li:hover:nth-child(8n+3) {
  border-bottom: #C70039 3px solid;
}
.nav li:hover:nth-child(8n+4) {
  border-bottom: #76C1CE 3px solid;
}
.nav li:hover:nth-child(8n+5) {
  border-bottom: #9276CE 3px solid;
}
.nav li:hover:nth-child(8n+6) {
  border-bottom: #E1DCEC 3px solid;
}
.navbar-toggle .icon-bar{
    color: #fff;
    background: #fff;
}
Je tiens à m’excuser je reprends et je suis un peu perdu mdr

Merci ! ( Je tiens a préciser j'utilise le Freamwork Bootstrap )
TheOldNoob

TheOldNoob Le 14 juillet 2017 à 09:41

Salut, 
C'est assez normal, de ce que je vois, tu a réduit la largeur de ton navigateur. Mais tu ne tiens pas compte des largeur d'écran utilisé sur les différents média.

La a vu de nez, je dirais que tu a une largeur de 200px max. Je connais pas de média qui utilise cette largeur.
Ce qu'il va y avoir de plus petit, c'est les smartwatch qui sont en général a 320px de large.
Après on passe a du 360 pour des écrans de smartphone 4"
Je te fait pas toute la liste je te laisse chercher 😀

Pour info bootstrap :

  • xs= 0-767 pixels
  • sm = 768-991 pixels
  • md = 992-1199 pixels
  • lg = 1200 pixels and up
Vous devez être connecté pour poster une réponse. Se connecter ou Créer un compte