React toastify text and close button is not aligned to the toast container

Question

React toastify text and close button is not aligned to the toast container

This is the toast container in app.js and there is no

          <ToastContainer
            position="bottom-center"
            autoClose={5000}
            hideProgressBar={false}
            newestOnTop={false}
            closeOnClick
            rtl={false}
            pauseOnFocusLoss
            draggable
            pauseOnHover
            theme="colored"
          />



 export const showErrorToast = (message) => {
  toast.error(message, {
    position: "bottom-center",
    autoClose: 3000,
    hideProgressBar: false,
    closeOnClick: true,
    pauseOnHover: true,
    draggable: true,
    progress: undefined,
    progressStyle: { background: "#DBDBDB" },
    theme: "colored",
    style: { background: "#ED664B" },
  });
};

Answer 1

Looks like there was button css on a Login.css file, removing this solved the issue

button {
  background-color: #b10201;
  color: white;
  width: 100%;
  height: 32px;
  border: none;
  border-radius: 10px;
  cursor: pointer;
}