Can't make scroller work outside of Chrome

[isld]

In our project we use react-scroll to guide the user through a set of questions. You answer one and it scrolls to the next one right after it renders.

That's the code:

import { Element, scroller } from 'react-scroll';
...
export const goToElement = (element, containerId) => {
  scroller.scrollTo(element, {
    containerId,
    duration: 1000,
    offset: -70,
    smooth: true,
  });
};
...
  componentDidUpdate(prevProps) {
      ...
      goToElement(nextQuestionId, 'questionsContainer');
    }
  }

...and then there is the container with id="questionsContainer" and all the questions in it, wrapped in an <Element> with the proper name prop. The scrolling is done in componentDidUpdate because each new question renders after the previous one has been answered.

The thing is that the whole thing works perfectly in Chrome and doesn't work in any other browser I have on my PC - Firefox, Edge or IE.

Any suggestions?

[Nandez89]

Having the same issue, so just checking if anyone has found a solution yet?

[Nandez89]

In case someone is still stuck in this I was able to solve it by defining the height of the container (The parent of the element with the overflow property). Otherwise firefox takes the whole page as a scroll area and the smooth scroll effect does not get applied