Topic: SideNav Main/Content Padding
Expected behavior I expect the left padding added to the main section (id: page-content) to match the width of the SideNav.
Actual behavior The expected padding is doubled and the page content is not adjacent to the Sidenav.
Resources (screenshots, code snippets etc.) https://mdbootstrap.com/snippets/standard/mcfarland/2700573
Hello Jordan,
I prepared a snippet for You, check if this solves your problem,
Code snippet: https://mdbootstrap.com/snippets/standard/mcfarland/2700573#js-tab-view
Best regards
Hello Jordan,
If I understand correctly, I suggest adding the data-mode="over" attribute to the <div>class="sidenav d-flex flex-column"> and then add padding-left: 200px property in the <div id="page-content"> . If this does not solve your problem, please provide a more detailed description.
Best regards
Jordan commented 4 years ago
Hi @Piotr Urbaniak, I want the side nav to be displayed next to the page content - not over it. Sorry for not clarifying in OP.
Thank you for the suggestion!
Piotr Urbaniak commented 4 years ago
Did You try set sidenav div as child element and add data-mode=side to it? Check our tab "Positioning" on https://mdbootstrap.com/docs/standard/navigation/sidenav/ Best regards
Jordan commented 4 years ago
If I am understanding you correctly, I believe that is what I did in the snippet I originally posted and it did not work.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Free
- Premium support: No
- Technology: MDB Standard
- MDB Version: 2.0.0
- Device: PC
- Browser: Chrome
- OS: Windows 10
- Provided sample code: No
- Provided link: Yes