Fix Responsive Navbar

Fix Responsive Navbar

I'm building a bootstrap4 nav-bar that is responsive to different platforms/devices. The nav-bar is not responsive to mobile screen-size. Below is the Template

I'm building a bootstrap4 nav-bar that is responsive to different platforms/devices. The nav-bar is not responsive to mobile screen-size. Below is the Template

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1                /jquery.min.js"></script>
<title>World Visuo</title>

<!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">

<body>

<!-- navbar starts here --> <nav class="navbar navbar-inverse navbar-fixed-top"> <div class="container-fluid"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar" aria-controls="myNavbar" aria-expanded="false" aria-label="Toggle navigation"> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <a class="navbar-brand" href="#">World Visuo</a>

<div class="collapse navbar-collapse" id="myNavbar"> <ul class="nav navbar-nav navbar-right" > <li class="active"><a href="#">Community</a></li> <li class="popup1_open"><a href="#">Sign Up</a></li> <li class="popup2_open"><a href="#">Login</a></li> </ul> </div>

</div>

</nav>

<!-- section 1 starts here--> <div class="container-fluid"></div><!-- section 1 ends -->

<!-- Latest compiled JavaScript --> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"> </script> </body> </html>

i expect the "Community,sign Up,Login" to be toggled by the button but only hides the content but doesn't open. What am i doing wrong ?

Angular 9 Tutorial: Learn to Build a CRUD Angular App Quickly

What's new in Bootstrap 5 and when Bootstrap 5 release date?

Brave, Chrome, Firefox, Opera or Edge: Which is Better and Faster?

How to Build Progressive Web Apps (PWA) using Angular 9

What is new features in Javascript ES2020 ECMAScript 2020

Build Responsive website with HTML CSS Bootstrap 4 and JavaScript [2020]

Welcome, to the best video on complete HTML and CSS Course with one Project in one video in 2020. In this HTML CSS tutorial for beginners, you'll learn the fundamentals of web development(HTML and CSS), along with best practices and professional problem-solving techniques using Developer Tools. Now, What is HTML & CSS 2020?

Build a Register & Login Form using PHP, HTML, CSS, Bootstrap and MySQL

In this tutorial you will learn and build a Responsive PHP Registration & Login Form using PHP, HTML, CSS, Bootstrap and MySQL