Tue, 2018-05-01 18:47
I'm using a height of 60px on a text section of my home page in order to keep my grid boxes the same height
This is on my site at Dealmazing
This is an image of the grid boxes here https://ibb.co/eSGLtn
you can I've circled the part i'm asking about.
It looks fine on desktop--but when you get to Mobile it has too much spacing.
Example of that here: https://ibb.co/j5c4KS
I notice that on mobile if i remove the height it looks perfect, but then if you look at it on desktop, all of the grids are misaligned.
anyone have a good solution for this?
Tue, 2018-05-01 21:30
#1
Simple
For your smaller viewports (phones, tablets, e.g.) simply remove the height property.
For accessibility's sake, carefully reduce your viewport width until there's a break in the design. Then compute your breakpoint width in EMs. This will allow for the user setting a different default font size from your own.
gary
Wed, 2018-05-02 00:36
#2
duh, i should have known
duh, i should have known this. thanks for smacking me in the head Gary--much appreciated.