So basically it looks like my carousel does not have any styling whatsoever. I copied the exact code from ng-bootstrap carousel example but mine looks like this when running.

This is ngbootstraps result.

Steps I did before:

I installed @ng-bootstrap/ng-bootstrap, then I added bootsrap to my css and after that I imported ngModule and added it to my modules.

Any ideas why this does not work?

CodePudding user response：

So, in my opinion, you added bootstrap incorrectly. When you are implementing bootstrap 5 to your html besides adding this in :

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

You also have to add this right before body closing tag:

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

This script basically makes interactive elements possible without using js. Here is a link to doccumentation if you want to learn more: https://getbootstrap.com/docs/5.2/getting-started/introduction/ Lemme know if this helped