search

fkhadra / react-toastify

React notification made easy 🚀 !
https://fkhadra.github.io/react-toastify/introduction
MIT License
12.75k stars 700 forks source link

When ToastContainer is stacked and position is bottom-x there is problem with the position #1067

Open maorz555 opened 9 months ago

maorz555 commented 9 months ago

Do you want to request a feature or report a bug? Bug What is the current behavior? Position is too low and multiple containers not act like the video on the docs If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your CodeSandbox (https://codesandbox.io/s/new) example below: https://codesandbox.io/p/sandbox/elastic-marco-htvygy What is the expected behavior? Like the video in this link : https://fkhadra.github.io/react-toastify/migration-v10#react-18-is-the-minimum-required-version-but Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React? "react-toastify": "^10.0.4", "react": "18.2.0", "react-dom": "18.2.0",

hunxjunedo commented 9 months ago

looks like it works ok for toasts on top, but it has issues at the bottom

maorz555 commented 6 months ago

any updates ?

CopperEagle commented 1 week ago

Hello everyone!

For anyone experiencing the same issue, here is a make-do solution, at least until this is fixed:

Simply hand the position prop to the ToastContainer directly and do not pass it to the toast emitter (the toast function). Like this:

 <ToastContainer stacked position="bottom-left" />