Bonjour je dois mettre un jour un site pour qu'il soit responsive sur smartphone.
Pour cela j'utilise le framework materialize. Une fois le site fini je le met en ligne tout marche mais je me rend compte qu'il y a un gros problème avec la navbar sur téléphone, elle est pas lisible du tout. J'ai d'abord pensé que c'était sur mon site mais non.
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script type="text/javascript" src="js/jquery.js"></script>
<meta charset="ISO-8859-1">
<title></title>
</head>
<body>
<nav>
<div class="nav-wrapper">
<a href="#!" class="brand-logo">Logo</a>
<a href="#" data-target="mobile-demo" class="sidenav-trigger"><i class="material-icons">menu</i></a>
<ul class="right hide-on-med-and-down">
<li><a href="sass.html">Sass</a></li>
<li><a href="badges.html">Components</a></li>
<li><a href="collapsible.html">Javascript</a></li>
<li><a href="mobile.html">Mobile</a></li>
</ul>
</div>
</nav>
<ul class="sidenav" id="mobile-demo">
<li><a href="sass.html">Sass</a></li>
<li><a href="badges.html">Components</a></li>
<li><a href="collapsible.html">Javascript</a></li>
<li><a href="mobile.html">Mobile</a></li>
</ul>
<script type="text/javascript" src="js/materialize.min.js"></script>
<script src="js/manage.js" type="text/javascript"></script>
</body>
</html>
C'était pour savoir si un problème similaire est arrivé a quelqu'un ou alors c'est le framwork qui est cassé (ce qui m’étonnerai il a l'air assez utilisé). Merci
Edit je laisse le message si quelqu'un a le même probème que moi
C'est bon j'ai trouvé ! - - ' (alors c'est la honte)
Il suffit de bien mettre la balise meta de la librairie dans le head.
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
Je pensais quelle n’était que à titre informatif pour les navigateurs mais en fait elle bouge aussi l'affichage en initialisent la taille de l'écran !
(dire que j'ai passer une demi journée sur ça :)))))...)
- Edité par Genkic's 12 juillet 2019 à 15:30:05
Navbar avec materialize probleme d'affichage
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
