Bootstrap dropdown
Résolu
raxos
Messages postés
674
Date d'inscription
Statut
Membre
Dernière intervention
-
raxos Messages postés 674 Date d'inscription Statut Membre Dernière intervention -
raxos Messages postés 674 Date d'inscription Statut Membre Dernière intervention -
Bonsoir,
J'ai encore un probleme avec bootstrap...Decidement, depuis la 4.x, c'est compliqué....
J'ai récupéré leur code pourtant, mais le dropdown ne fonctionne pas (il ne s'ouvre pas).
Merci d'avance si quelqu'un trouve la solution.
J'ai encore un probleme avec bootstrap...Decidement, depuis la 4.x, c'est compliqué....
J'ai récupéré leur code pourtant, mais le dropdown ne fonctionne pas (il ne s'ouvre pas).
<nav class="navbar navbar-expand-lg navbar-light bg-light"> <a class="navbar-brand" href="#">Navbar</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Dropdown </a> <div class="dropdown-menu" aria-labelledby="navbarDropdown"> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Another action</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="#">Something else here</a> </div> </li> <li class="nav-item"> <a class="nav-link disabled" href="#">Disabled</a> </li> </ul> <form class="form-inline my-2 my-lg-0"> <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search"> <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> </form> </div> </nav>
Merci d'avance si quelqu'un trouve la solution.
A voir également:
- Openjdk 64-bit server vm warning: sharing is only supported for boot loader classes because bootstrap classpath has been appended
- Winrar 64 bit - Télécharger - Compression & Décompression
- What is my movie français - Télécharger - Divers TV & Vidéo
- Cle windows 10 professional 64 bit gratuit - Guide
- Boot camp windows 10 64 bit download - Télécharger - Systèmes d'exploitation
- Dual boot - Guide
1 réponse
Bonjour,
En prenant ton code ( qui est le même que celui de la documnetation officielle ) et en le mettant dans une page html... aucun souci
Si il y a un blocage... il est certainement lié à autre chose dans ta page....
Au cas où, penses aussi à vérifier que ton fichier est bien encodé en utf-8 sans bom (voir chapitre 1 de ce lien : https://forums.commentcamarche.net/forum/affich-37584944-php-html-caracteres-accentues-et-l-utf8)
En prenant ton code ( qui est le même que celui de la documnetation officielle ) et en le mettant dans une page html... aucun souci
<html> <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> </head> <body> <nav class="navbar navbar-expand-lg navbar-light bg-light"> <a class="navbar-brand" href="#">Navbar</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Dropdown </a> <div class="dropdown-menu" aria-labelledby="navbarDropdown"> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Another action</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="#">Something else here</a> </div> </li> <li class="nav-item"> <a class="nav-link disabled" href="#">Disabled</a> </li> </ul> <form class="form-inline my-2 my-lg-0"> <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search"> <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> </form> </div> </nav> </body> </html>
Si il y a un blocage... il est certainement lié à autre chose dans ta page....
Au cas où, penses aussi à vérifier que ton fichier est bien encodé en utf-8 sans bom (voir chapitre 1 de ce lien : https://forums.commentcamarche.net/forum/affich-37584944-php-html-caracteres-accentues-et-l-utf8)
raxos
Messages postés
674
Date d'inscription
Statut
Membre
Dernière intervention
64
merci, probleme résolu grace au dernier paragraphe.