Hi! I'm having trouble making my project fit all screens.
This is my project link: http://bit.ly/shoppingSMP
I've made this project 7000px wide - scrollable horizontal - with a fixed object (the shopping cart) to make it feel like you are pushing the cart along the street. I then set height to about 1200 px, to prevent the bottom of the screen to go white.
I want this project to look good on mobile, iPad, laptop and PC/Mac - both orientations.
I thought I was in the clear with theese settings, but checking it on a small screen (laptop), the bottom of the stage fell out of the screen. And we can't have that...
I tried setting the height to 100%, tried having a smaller height (800px) and setting the background color to green, tried hiding and showing the overflow, but I can't seem to hit the perfect settings for this to work.
My inspiration comes from this project: http://www.futureofcarsharing.com
Now, this works - as far as I can see - on all screens, both orientations.
How do I do this? Does anyone know?
Thanks a lot!
Best regards, Liv from Norway
Pushing this a bit in hope to maybe get help from someone? What am I doing wrong since my project doesn't fit laptop screens?
It looks like your stage is just too large for the screen. I would suggest thinking about your background as being 100% height, and then pinning your objects to the top and bottom of the stage with fixed number of pixels.
Hope that helps point you in the right direction!