# Scale problem in FIT mode

**URL:** <https://phaser.discourse.group/t/scale-problem-in-fit-mode/9536>\
**Category:** Phaser 3\
**Created:** [May 12, 2021, 8:31am UTC](https://phaser.discourse.group/t/scale-problem-in-fit-mode/9536 "2021-05-12T08:31:46Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Matthieu-BRANTHOME](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/matthieu-branthome/32/5160_2.png) [@Matthieu-BRANTHOME](https://phaser.discourse.group/u/Matthieu-BRANTHOME)\
**Post date:** [May 12, 2021, 8:31am UTC](https://phaser.discourse.group/t/scale-problem-in-fit-mode/9536/1 "2021-05-12T08:31:46Z")

</div>

Hi,

i’m using Phaser 3.53.1 version:

```
<script src="https://cdnjs.cloudflare.com/ajax/libs/phaser/3.53.1/phaser-arcade-physics.min.js"></script>

```

I have a scale problem:

- when I decrease the size of the browser window, the canvas shrinks perfectly  

- but when I enlarge it using the restore button (the square at the top right corner of the browser), the canvas does not return to its normal size.  

- strangely, when I resize by hand the browser window, slowly, I mean step by step, the canvas returns to its original size.  

Here is my code:

The phaser configuration

```
// Configuration constants

const tileWidth = 128;

const nbTileGameWidth = 18;

const nbTileGameHeight = 7;

const gameWidth = nbTileGameWidth * tileWidth;

const gameHeight = nbTileGameHeight * tileWidth;

var config = {

    type: Phaser.AUTO,

    scale: {

        mode: Phaser.Scale.FIT,

        parent: 'phaser-game', // Attached DOM element

        width: gameWidth,

        height: gameHeight

    },

    physics: {

        default: 'arcade',

        arcade: {

            gravity: { y: 300 },

            debug: false

        }

    },

};

game = new Phaser.Game(config);

```

The HTML code:

```
<div class="container-fluid" style="height: 100vh">
    <div class="row h-100">

        <div class="col-4 bg-dark h-100 border-end border-2 d-flex flex-column" >
             Something
        </div>
        <div class="col-8 h-100 d-flex flex-column">
           <div class="row border-bottom border-2">

                <div class="col p-0 m-0 bg-dark">

                    <div id="phaser-game"></div>

                </div>

            </div>

            <div class="row border-bottom border-2 bg-dark" style="height: 9%">

                <div class="col h-100 m-0 p-0">

                    <div class="row h-100 m-0 p-0">

                        <div class="col-2 h-100 m-0 p-0 d-flex align-items-center">

                            <div class="d-grid gap-2 col m-0 p-1 ">

                                <button id="runButton" onclick="runIt()" class="btn btn-success"

                                    type="button" disabled>Executer</button>

                            </div>

                        </div>

                        <div class="col-2 h-100 m-0 p-0 d-flex align-items-center">

                            <div class="d-grid gap-2 col m-0 p-1 ">

                                <button id="stopButton" onclick="stopIt()" class="btn btn-primary"

                                    type="button" disabled>Arrêter</button>

                            </div>

                        </div>

                        <div class="col-8 h-100 m-0 p-0 overflow-auto " id="alertContainer"></div>

                    </div>

                </div>

            </div>

            <div class="row overflow-auto bg-dark flex-grow-1" >

                <div class="col m-0 p-0">

                    <div class="fs-6" id="codemirror-editor"></div>

                </div>

            </div>

        </div>

    </div>

</div>

```

What do you think? Does anyone have any ideas?

Thanks in advance for your help!

Matthieu B

---

<div class="post-metadata">

**Author:** ![Matthieu-BRANTHOME](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/matthieu-branthome/32/5160_2.png) [@Matthieu-BRANTHOME](https://phaser.discourse.group/u/Matthieu-BRANTHOME)\
**Post date:** [May 14, 2021, 8:31am UTC](https://phaser.discourse.group/t/scale-problem-in-fit-mode/9536/2 "2021-05-14T08:31:42Z")

</div>

By the way, the problematic operation is the same (not resizing the game canvas) if I minimize the browser window and then switch to full screen mode (F11).  
Am I in the case of a bug, and should I open a request on GitHub? or is it just a misuse from me ?

Thanks for your help,

MatthieuB
