I have found a very strange issue in regards to positioning the containers on the screen on different screen size. For example, I have set my screen size as window.innerWidth X window.innerHeight. So the center of the screen is centerPoint = (window.innerWidth / 2, window.innerHeight / 2). When I place some circle shape container at (centerPoint.x + 570, centerPoint.y + 370), I expect that it would be displayed at the bottom right corner of the browser screen. But the display is different on my macbook and PC. On my Macbook it display correctly and I can see the entire container. But on PC I can only see the left edge of the container at the bottom right. The rest of container is outside the screen, I have to move it back to (centerPoint.x + 510, centerPoint.y + 370) to display it fully on PC. However this change makes it shift left on my Macbook browser screen.
How can I make them work like the same? I use a camera so I hope I can position containers relative to the camera center.