React - Viewport being ignored

Question

In my index file I have the following:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

I am using React to load the page, but the main index file is an HTML file. (.pug)

This is inserted correctly into the DOM. However, the viewport is ignored - my page is showing the desktop version.

If I edit the DOM in the Chrome dev tools, eg. change 1 to 1.0 or any other part of the meta tag, it causes the page to re-calculate the viewport correctly, and will then display correctly straight away. Any ideas?

You might need to click the image to see the GIF animation.

Answer 1

Try using meta(name='viewport', content='width=device-width, initial-scale=1.0') in your index.pug file.

---

Based on your code, try using meta(name='viewport', content='width=device-width, initial-scale=1.0, maximum-scale=1.0')

Answer 2

Try using this. It works for me.

<meta name="viewport" content="width=device-width" initial-scale="1.00" maximum-scale="1.0" />