I am working on a react project using react-bootstrap and facing this warning when clicking on the dropdown menu.
Popper: CSS "margin" styles cannot be used to apply padding between the popper and its reference element or boundary. To replicate margin, use the offset
modifier, as well as the padding
option in the preventOverflow
and flip
modifiers.
<Dropdown alignRight className="dropdown m-0">
<Dropdown.Toggle as={CustomToggle} />
<Dropdown.Menu style={{ margin: 0 }}>
<Dropdown.Item >edit</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
How can I solve this issue ?
By adding style with margin the error message disappears
Dropdown.Menu style={{ margin: 0 }}