I’m new to ionic and to css - so forgive my ignorance.
I’ve made a game where I deal 92 cards face down for the user to pick, one by one.
I put the cards in a 12 column grid with 8 rows. For most screen sizes all the cards fit on one screen, but as the screen gets larger, the grid is too large for a screen, and the user must scroll down to get to the bottom.
I played with CSS and found that if I added left and right margins, I could shrink the size of the grid until it fit on one screen - but now when I shrink the screen size, it’s much too small for smaller screens.
I’ve tried to create CSS classes that are “responsive” meaning - I had hoped that different constraints could be used for different screen sizes - but without success.
I (think I) want to operate on the entire grid - but so far my class seems all or nothing - no “responsiveness.”
Can someone help me figure out how to apply a CSS class to ion-grid in a responsive way? Or - tell me how to specify margins (I’m currently using left: 20% -for example) that are “responsive” meaning that I could use different numbers for different sized screens?
I would be most appreciative of any help! thanks!
1 post - 1 participant
