Project Issues
Layout does not responsive now. I am planning to fix it.
Description
It’s hard to make my layout responsive as I want div (which holds the game logic) location to be related to the background image coordinates. I've placed div using position relative/absolute, left/right in pixels, and the div size are constant. This solution works only on one size screen.
Link to repo: https://github.com/tradu0606/Whack-A-Mole-game Link to deployed app: https://tetyanaradu.azurewebsites.net/
Things you'd like specific feedback on:
Project Issues Layout does not responsive now. I am planning to fix it.
Description It’s hard to make my layout responsive as I want div (which holds the game logic) location to be related to the background image coordinates. I've placed div using position relative/absolute, left/right in pixels, and the div size are constant. This solution works only on one size screen.
Code Snippet body{ text-align: center; background-color: #A0A0A0; background: url("/assets/game-background.jpeg"); background-size: cover; background-repeat: no-repeat; position: relative; min-width: 1040px; }
borderCont {
position: absolute; min-width: 850px; min-height: 280px; margin: 0 auto; text-align: center; padding: 0; max-width: 500px; left: 160px; top: 300px; }