Topic: MDBDropdownMenu leaving screen
Matheus Pereira asked 5 years ago
My dropdown menu is leaving the screen on the top right. How can I fix it?
I already tried to add the class dropdown-menu-right, but it makes no difference
This is the code (the same from the examples): `
<MDBNavItem>
<MDBDropdown>
<MDBDropdownToggle nav caret>
<MDBIcon icon="user" />
</MDBDropdownToggle>
<MDBDropdownMenu className="dropdown-default dropdown-menu-right">
<MDBDropdownItem href="#!">Action</MDBDropdownItem>
<MDBDropdownItem href="#!">Another Action</MDBDropdownItem>
<MDBDropdownItem href="#!">Something else here</MDBDropdownItem>
<MDBDropdownItem href="#!">Something else here</MDBDropdownItem>
</MDBDropdownMenu>
</MDBDropdown>
</MDBNavItem>
Konrad Stępień staff answered 5 years ago
Hi @Matheus Pereira,
Try add right
property like this:
<MDBDropdownMenu right className='dropdown-default'>
<MDBDropdownItem href='#!'>Action</MDBDropdownItem>
<MDBDropdownItem href='#!'>Another Action</MDBDropdownItem>
<MDBDropdownItem href='#!'>Something else here</MDBDropdownItem>
<MDBDropdownItem href='#!'>Something else here</MDBDropdownItem>
</MDBDropdownMenu>
Matheus Pereira answered 5 years ago
@Konrad Stępień Thank you so much for the fast answer, it worked!!
Where can I see the documentation for this? Where could I have read about the "right" option?
Thanks again!
Konrad Stępień staff commented 5 years ago
Hi @Matheus Pereira,
You should find this property on this page. On top of page you have Api
tab there you can find documentation about this component.
I found this property from our demo page and I have not noticed that our documentation does not have this property described. I will fix it for next release (12 November)
Sorry for problems and best regards, Konrad!
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB React
- MDB Version: 4.10.0
- Device: Desktop
- Browser: Chrome
- OS: Linux Mint
- Provided sample code: No
- Provided link: No