Rescale canvas phaser element in CSS and buttons area

Phaser 2 / CE
1

Hi,
My canvas element original size this is: 800x450 (px) and when I rescale my project in css, e.g. to 100% of the window (width: 100% or transform scale), the graphics rescale correctly but the button area remains in the old original places. Does anyone know how I can fix this?

2

You can try game.scale.refresh().

3

Hmm, unfortunately it doesn’t work, I tried to add it inside setTimeout too. Generally when I narrow the window to 800 px and less then the buttons are ok.

const config = {
width: 800, // 800
height: 450, // 450
renderer: Phaser.AUTO,
parent: 'game-content',
enableDebug: false,
state: {
    preload: preload,
    create: create,
    update: update
}

};
const game = new Phaser.Game(config);
game.scale.refresh();

4

I would try the Scale Manager instead, then.

5

Yes it works, thanks so much