I am building an Angular 12 app using Bootstrap 5 and NGX-Bootstrap. I want to create a side navigation bar that is active by default, but collapsible. Is it possible to achieve this with Bootstrap 5 Offcanvas? I like the ease of implementation with the Offcanvas component and would prefer to use this as opposed to creating my own using CSS. The default element overlays the content instead of pushing it. Has anyone done this?

Example of what I'm looking for: https://startbootstrap.com/previews/simple-sidebar

CodePudding user response：

"Is it possible to achieve this with Bootstrap 5 Offcanvas? I like the ease of implementation with the Offcanvas component and would prefer to use this as opposed to creating my own using CSS."

No, it's not possible using the Offcanvas component since the default Offcanvas is an overlay implementation. Therefore it's going to require custom CSS.

Here's an example Bootstrap 5 push implementation that doesn't use Offcanvas