28160 sujets

CSS et mise en forme, CSS3

Bonjour,
Avec Knacss v7 j'essaie de construire un menu burger en plus de mon menu normal. Le menu normal s'affiche sur un écran de taille normal ou large et lorsque l'affichage est fait un petit écran alors ce dernier ce masque pour laisser apparaître le bouton du menu burger.

Mon code

			<nav class="grid-2">
			<div class="left">
					<p class="logo">ppp</p>
			</div>
			<div class="right">
				<div class="grid-2-small-1">
					<div class="large-visible medium-visible small-hidden">
						<ul class="unstyled">
							<li class="txtwhite"><a href="#accueil">Accueil</a></li>
							<li class="txtwhite"><a href="#gamme">Gamme</a></li>
							<li class="txtwhite"><a href="#accessoire">Accessoires</a></li>
							<li class="txtwhite"><a href="#contact">Contact</a></li>
						</ul>
					</div>
					<div id="burger" class="large-hidden medium-hidden small-visible" onclick="myFunction(this)">
						<div class="bar1"></div>
						<div class="bar2"></div>
						<div class="bar3"></div>
					</div>
				</div>
			</div>


A 1900px de large le burger est masqué et le normal reste affiché
A 750px de large je bascule en mode petit écran, le normal disparaît et le burger s'affiche
A 560px de large je me retrouve avec les deux menus qui s'affiche un peu n'importe comment

Est-ce que j'ai loupé un truc ?
Modifié par flipflip (28 Oct 2019 - 16:38)