Responsive game size in mobile browser

Hello all!
I have a question about game resizing - how i can do responsive game for mobile browser&
I use this properties in config:
scale: {
mode: Phaser.Scale.FIT,
autoCenter: Phaser.Scale.CENTER_BOTH,
},

On PC - game looks ok, on all screen.
But, if open the game in mobile browser - game have small size, not responsive.

Does it scale to fit if you resize the window?

Yes, on PC if i resize, the game size is responsive

Do you have

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

?

Yes, i use this property/

Screenshot this?

What’s in the HTML?


<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Game</title>
	<style>
		body {
			padding: 0;
			margin: 0;
			background-color: #000;
		}
	</style>
</head>

Tag <body> has only scripts.

This looks right for scale mode FIT.

What do you want it to look like?

It would be OK if background get all screen size on mobile, like css property backround-size: cover;

It exists:

  object-fit: cover;

oh but im not sure it’s for img and video inittial

I know this property in css - it uses for video and images, but how this use in Phaser?
Can you show example?

One of the possible options, made by me.
Youtube: https://youtu.be/Q9tEcOsouJk

Live: https://qugurun.github.io/phaser3/scale/index.html
Source: https://github.com/Qugurun/qugurun.github.io/tree/main/phaser3/scale