turnA Posted June 8, 2015 Share Posted June 8, 2015 Hi there, I have just updated my games with the latest Phaser 2.3, but it seem now my games will not horizontally aligned to Center like usual, it just stay left aligned. Vertical align has no problem though.Do anyone have problem like this with Phaser 2.3? My css in index.html: body { margin: 0; padding: 0; background-color: #1d4633; } canvas { padding-left:0; padding-right:0; margin-left:auto; margin-right:auto; display:block; width:100%; }My scaling and align code in boot.js:this.stage.backgroundColor = '#1d4633';this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;this.scale.pageAlignHorizontally = true;this.scale.pageAlignVertically = true;Any help will be greatly appreciated!Thanks. Link to comment Share on other sites More sharing options...
icp Posted June 8, 2015 Share Posted June 8, 2015 http://www.html5gamedevs.com/topic/13874-pagealignvertically/#entry79067 Link to comment Share on other sites More sharing options...
turnA Posted June 8, 2015 Author Share Posted June 8, 2015 Thank you for your reply icp, but I have problem with the horizontal align, not vertical.I also want to add that my Phaser/canvas element is located directly on the window element, not under div element or something. Link to comment Share on other sites More sharing options...
icp Posted June 8, 2015 Share Posted June 8, 2015 Try this:this.stage.backgroundColor = '#1d4633';this.scale.pageAlignHorizontally = true;this.scale.pageAlignVertically = true;this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; Link to comment Share on other sites More sharing options...
turnA Posted June 8, 2015 Author Share Posted June 8, 2015 I have tried too icp, unfortunately that doesn't work Thanks for the help though, been pulling my hair for several hours now. I just don't understand, how this thing (aligning) that worked flawesly before, suddenly changed now... Link to comment Share on other sites More sharing options...
turnA Posted June 9, 2015 Author Share Posted June 9, 2015 Anyone? Is it only me that encounter this problem on Phaser 2.3??Maybe I can see any example project that can successfully have center horizontal align using Phaser 2.3?Appreciate any feedback/reply/information... Link to comment Share on other sites More sharing options...
drhayes Posted June 10, 2015 Share Posted June 10, 2015 Looks like your CSS will take care of that with the margins set like that. What happens if you remove the "this.scale.pageAlignHorizontally = true;" line? I'd take out the "width: 100%", though... and the "display:block", that's redundant. turnA 1 Link to comment Share on other sites More sharing options...
turnA Posted June 10, 2015 Author Share Posted June 10, 2015 @drhayes: Wow, you are right! I must use ONLY the CSS or the horizontalAlign = true; to make it work.I think that make it easier for new user of Phaser, but it certainly confuse old timer like me who has limited knowledge of CSS and only use old template that works without problem before. Thanks for the help drhayes! Jhice 1 Link to comment Share on other sites More sharing options...
Recommended Posts