In Bootstrap 5, Dropdown menu doesn't work-CodePudding

Code - https://github.com/Alex-Toucan/atproducts.xyz/blob/main/backup/index.html

CSS - https://github.com/Alex-Toucan/atproducts.xyz/tree/main/static

Hello community, I have tried to make a new nav-bar. With everything I tried, the Dropdown menus don't do their job. May someone please help? Thanks.

CodePudding user response：

looks like you forgot to include js from bootstrap, because bootstrap navbar requires js.

try adding this

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP JcXn/tWtIaxVXM" crossorigin="anonymous"></script>

CodePudding user response：

If you want to use bootstrap you need to import bootstrap's resources by downloading it then running the project offline or using cdn and then running the project online. For a simpler way you can use cdn like this.

Adding this inside your tag head html, to import bootstrap css resource

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

Adding this inside your body tag html, place it at the bottom, to import bootstrap js and popper resource .

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP JcXn/tWtIaxVXM" crossorigin="anonymous"></script>