I've been struggling with my navigation bar built using HTML, CSS, and Bootstrap. Despite following tutorials on YouTube, I can't seem to get the toggle button to expand when the screen size is reduced to the smallest. Starting a new project, I implemented all of this with HTML, CSS, and Bootstrap, and opened the HTML file locally. Could you please help me? I've been stuck for hours.
Here are the codes I used:
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta http-equiv="X-UA-Compatible" content="ie=edge"/>
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<link rel="stylesheet" href="bootstrap.min.css"/>
<link rel="stylesheet" href="title.css" />
<title>Document</title>
</head>
<body>
<nav class="navbar navbar-expand-md navbar-light bg-light sticky-top">
<button class="navbar-toggler" data-toggle="collapse" data-target="#collapse_target">
<span class="navbar-toggler-icon></span>
</button>
<div class="collapse navbar-collapse" id="collapse_target">
<a class="navbar-brand>Logo</a>
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link href="#">Link 1</a>
</li>
<li class="nav-item">
<a class="nav-link href="#">Link 2</a>
</li>
<li class="nav-item">
<a class="nav-link href="#">Link 3</a>
</li>
</ul>
</div>
</nav>
</body>
My current result looks like this:
https://i.sstatic.net/g26eX.png
I see the toggler icon but am unable to click it to access 'Home', 'Categories', 'About' or 'Contact'. Can you point out where I might have gone wrong?
Thank you for your assistance.