Font-size acting differently locally vs. in production within a React-boostrap Navbar

Question

I have a website I am serving via Heroku that uses <Navbar> from React-bootstrap.

The issue is that the text of the website within the <Navbar> is showing as much larger in production than it does locally. Does anyone know what could possibly be causing this? The text not in <Navbar> is ok.

Note also that I have checked google chrome tools font-size property and it is telling me that the font size is the exact same both locally and in production, it just looks completely differently sized.

Answer 1

The answer in the end was that I was zoomed in on chrome when looking at it via localhost but then when i went to look at it via the website the zoom was being reset. Zooming out solved the issue.