Bonjour,
J'ai un petit souci avec mon menu sur tablette / mobile :
- D'après mes tests avec Chrome, le menu ne collapse qu'en dessous de 768px, je voudrais qu'il collapse à partir de 1000px car les titres de menu sont assez longs et même en réduisant la typo et les paddings, ça rentre pas. Ci-dessous le code html, je n'ai pas touché à la css Boostrap pour le moment.
- Sur mobile, sur 2 pages sur 4, le menu collapsed que je déplie passe en dessous de mon contenu. J'ai limpression que ce sont les pages où j'ai un h1 et en dessous des colonnes. Quand je fais le test en mettant une simple image le menu revient au dessus et est donc lisible. Voyez vous quoi faire ?
Voici le code du menu :
Voici maintenant le début du code de ma page sur laquelle le menu passe en dessous du contenu :
Merci !!et bonne journée
J'ai un petit souci avec mon menu sur tablette / mobile :
- D'après mes tests avec Chrome, le menu ne collapse qu'en dessous de 768px, je voudrais qu'il collapse à partir de 1000px car les titres de menu sont assez longs et même en réduisant la typo et les paddings, ça rentre pas. Ci-dessous le code html, je n'ai pas touché à la css Boostrap pour le moment.
- Sur mobile, sur 2 pages sur 4, le menu collapsed que je déplie passe en dessous de mon contenu. J'ai limpression que ce sont les pages où j'ai un h1 et en dessous des colonnes. Quand je fais le test en mettant une simple image le menu revient au dessus et est donc lisible. Voyez vous quoi faire ?
Voici le code du menu :
<div class="header">
<nav class="navbar navbar-inverse" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li>
<a href="index.html">Accueil</a></li>
<li class="active"><a href="#">Titre assez long 1</a></li>
<li><a href="#">Titre assez long 2</a></li>
<li><a href="#">Titre assez long 3</a></li>
<li><a href="#">Titre assez long 4</a></li>
</ul>
</div>
</div>
</nav>
</div>
Voici maintenant le début du code de ma page sur laquelle le menu passe en dessous du contenu :
<div class="container">
<h1>Tout savoir sur le sujet</h1>
<div class="col-md-4 visuel-temoignage">
<img class="img-responsive" src="images/tout1.jpg" alt="">
</div>
<div class="col-md-4 img-temoignage">
<img class="img-responsive" src="images/tout2.jpg" alt="">
</div>
<div class="col-md-4 temoignage">
<img class="img-responsive" src="images/tout3.jpg" alt="">
</div>
</div>
Merci !!et bonne journée