Popper: CSS "margin" styles cannot be used to apply padding between the popper and its reference element or boundary. react bootstrap

Viewed 9278

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 ?

1 Answers

By adding style with margin the error message disappears Dropdown.Menu style={{ margin: 0 }}

Related