18041 sujets

Questions générales et questions de débutants

Problème menu dropdown sur mon site

Bonjour j'ai un soucis sur mon site j'ai créer une nav bar qui fonctionne sur la page d’accueil mais pas sur les autre page en responsive le dropdown ne s'ouvre pas je vous montre le code de la page d'accueil et d'une autre page et merci pour votre aide 

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mon sitee</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/styles.min.css">
    <link rel="stylesheet" type="text/css" href="style.css">

</head>

<body style="color:rgb(0,0,0);background-color:rgb(0,0,0);">
    <div>
        <nav class="navbar navbar-light navbar-expand-md navigation-clean" style="background-color:#000000;">
            <div class="container"><a class="navbar-brand text-white" href="#">Jules</a><button class="navbar-toggler" data-toggle="collapse" data-target="#navcol-1" style="background-color:#ffffff;color:rgba(136,136,136,0);"><span class="sr-only">Toggle navigation</span><span class="navbar-toggler-icon" style="background-color:rgba(0,0,0,0);"></span></button>
                <div
                    class="collapse navbar-collapse" id="navcol-1">
                    <ul class="nav navbar-nav ml-auto">
                        <li class="nav-item" role="presentation"><a class="nav-link text-white" href="Accueil.html">Accueil</a></li>
                        <li class="nav-item" role="presentation"><a class="nav-link text-white" href="portofolio.html">Portofolio</a></li>
                        <li class="nav-item" role="presentation"><a class="nav-link text-white" href="contact.html">Contact</a></li>
                            <div class="dropdown-menu" role="menu"><a class="dropdown-item" role="presentation" href="#">First Item</a><a class="dropdown-item" role="presentation" href="#">Second Item</a><a class="dropdown-item" role="presentation" href="#">Third Item</a></div>
                    </ul>
            </div>
        </div>
      </nav>
    </div>

    <div class="header">
        <h1 class="header-title">Mon site internet</h1>
        <p class="header-para">Je suis un étudiant passionné par la photographie et le développement web&nbsp;</p>
    </div>
    <div class="macouleur"> jjjj
    </div>
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
</body>

</html>


une autre page 

<!DOCTYPE html>
<html>
    <head>
        
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Mon sitee</title>
        <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
        <link rel="stylesheet" href="assets/css/styles.min.css">
        <link rel="stylesheet" type="text/css" href="style.css">
    </head>

    <body style="color:rgb(0,0,0);background-color:rgb(0,0,0);">
        <div>
            <nav class="navbar navbar-light navbar-expand-md navigation-clean" style="background-color:#000000;">
                <div class="container"><a class="navbar-brand text-white" href="#"></a><button class="navbar-toggler" data-toggle="collapse" data-target="#navcol-1" style="background-color:#ffffff;color:rgba(136,136,136,0);"><span class="sr-only">Toggle navigation</span><span class="navbar-toggler-icon" style="background-color:rgba(0,0,0,0);"></span></button>
                    <div class="collapse navbar-collapse" id="navcol-1">
                        <ul class="nav navbar-nav ml-auto">
                            <li class="nav-item" role="presentation"><a class="nav-link text-white" href="Accueil.html">Accueil</a></li>
                            <li class="nav-item" role="presentation"><a class="nav-link text-white" href="portofolio.html">Portofolio</a></li>
                            <li class="nav-item" role="presentation"><a class="nav-link text-white" href="contact.html">Contact</a></li>
                        </ul>
                        <div class="dropdown-menu" role="menu"><a class="dropdown-item" role="presentation" href="#">First Item</a><a class="dropdown-item" role="presentation" href="#">Second Item</a><a class="dropdown-item" role="presentation" href="#">Third Item</a></div>
                    </nav>
                </div>
                    
                 
                </div>
        </body>
    </html>
Salut,

Je ne sais pas si ton problème vient de la, mais ton balisage m'a l'air foireux, a priori la fin de la balise nav ne se ferme pas au bon endroit. (Tu commences en body > div > nav alors que tu finis en body < div < div < nav )

Bref, tu devrais essayer de mieux indenter ton code, ça sera plus simple à lire et à voir les erreurs.

Et si ton code est hébergé par la, un petit lien pour faciliter la tache pour voir le problème
Mathieuu a écrit :
Salut,

Je ne sais pas si ton problème vient de la, mais ton balisage m'a l'air foireux, a priori la fin de la balise nav ne se ferme pas au bon endroit. (Tu commences en body &gt; div &gt; nav alors que tu finis en body &lt; div &lt; div &lt; nav )

Bref, tu devrais essayer de mieux indenter ton code, ça sera plus simple à lire et à voir les erreurs.

Et si ton code est hébergé par la, un petit lien pour faciliter la tache pour voir le problème


Bonjour merci pour ton message, mon problème à était réssolu
Sujet clos
Aller à