Hello,
While testing my game, I found that Android tablets and Safari iphone browser UI overlaps my game screen.
var config = {
type: Phaser.AUTO,
width: 800,
height: 1280,
parent: ‘game’,
scene: {
preload: preload,
create: create,
update: update,
},
callbacks: {
postBoot: function (game) {
game.canvas.style.width = ‘auto’;
game.canvas.style.height = ‘100vh’;
game.canvas.style.maxWidth = config.width;
game.canvas.style.maxHeight = config.height;
game.canvas.style.display = ‘block’;
game.canvas.style.margin = ‘auto’;
}
}
}
It works totally perfect on iOS chrome and most Android smartphones.
I wish to view my game inside browser user interface without overlapping it. How to solve it?