Having Trouble w/ Stage Coordinates

[Nick Black]

I have tried to attach code with markdown and am hoping it formats correctly.  I'm sorry in advance if it doesn't.  I'm having a problem with the stage reflecting the X and Y as I would think they would be.  I am using debug code to view the X and Y on click and the origin doesn't line up with the stage as it should.  Does anyone know what I'm doing incorrectly here?  I was making a pong example to explore stage xl features such as the animatable class and advanceTime method.  Cheers!

```

dart

main.dart

var canvas = html.querySelector('#stage');

var stage = Stage(canvas, width: 1280, height: 800, options: options);

style.css

body

{

/* margin: 0; */

/* padding: 0; */

margin: 10em auto 5em auto ;

width: 50%;

height: 50%;

/* overflow: hidden; */

background-color: black;

}

#stage

{

touch-action: none;

/* position: absolute; */

margin: auto auto;

padding: 0;

width: 100%;

height: 100%;

overflow: hidden;

border: 2px solid rgb(0, 255, 34);

box-shadow: 1px 1px 1px #FFF;

}

ball.dart

if (_debug)

{

stage.onMouseClick.listen((MouseEvent e) {

print("Stage X: ${e.localX}, Stage Y: ${e.localY}");

});

}

```

[Nick Black]

..stageAlign = StageAlign.TOP_LEFT

seems to have set the origin at top left of screen like I expected. Is this all I was missing? If so, why is this happening this way? Thanks!

[Nick Black]

// * To get the current size of the Stage, you can query the contentRectangle property

Rectangle stageRect = stage.contentRectangle;

print("stage.contentRectangle: ${stageRect}");

stage.contentRectangle: Rectangle<num> [left=-0.0, top=-0.0, width=740, height=370]

this is what is returned by the print statement above. Even though this isn't the size I've given the stage in the CSS file