CODEWITHSUNDEEP
javascripthtmlcssbootstrap-4
user12180963
user12180963

Reputation:

Bootstrap 4 navbar button not working where is my fault

I did research on the internet but I couldn't solve my problem because my English is bad. I apologize. I open the subject again. My navbar toogle not working. ı didnt understand. where is my problem?

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="css/style.css">
<script type="text/javascript" src="css/jquery-3.5.0.js"></script>

    <div class="container-fluid mt-3 p-0">
  <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
      <a class="navbar-brand" href="#" id="navbaritem"><span style="color:skyblue" >FİRMA</span> ADI</a>
      <button class="navbar-toggler" data-toggle="collapse" data-target="#nvbCollapse">
        <span class="navbar-toggler-icon"></span>
      </button>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>

Upvotes: 0

Views: 176

Answers (1)

bharti parmar
bharti parmar

Reputation: 434

Bootstrap 4 navbar

You have not added any menu item. Nor have you given any menu item using the collapse class, what will it do and what it shows.

Try this and put your content inside it.

<div class="container-fluid">
  <nav class="navbar navbar-expand-lg navbar-dark bg-dark" style="margin:24px 0;">
  <a class="navbar-brand" href="#" id="navbaritem"><span style="color:skyblue" >FİRMA</span> ADI</a>
  <button class="navbar-toggler navbar-toggler-right collapsed" type="button" data-toggle="collapse" data-target="#Mymenu" aria-expanded="false">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="navbar-collapse collapse" id="Mymenu" >
    <ul class="navbar-nav mr-auto">
      <li class="nav-item">
        <a class="nav-link" href="">menu 1</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="">menu 2</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="">menu 3</a>
      </li>
    </ul>
  </div>
</nav>
</div>

Upvotes: 1

Related Questions