I only just started creating my site and I need to figure out how to maintain a 4px baseline row grid alignment for text at the bottom of the page WHILE ALSO maintaining a consistent bottom margin at different viewport heights. The way to accomplish this is eluding me. AI says it’s media queries using the modulus operator to target odd and even viewport heights. Does this sound right? It looks complicated
This does sound complicated!! And it sounds like a fun sudoku design puzzle
A few questions.
Why is this a priority? And follow on Q - how good is good enough? Do you need EXACTLY 4px or is a few px variation okay on some screen sizes?
Bottom margin height - I assume you have some text fixed in the viewport? Unless I misunderstand I would set that text to be positioned relative to the bottom of the viewport so that it’s always in reference to the bottom. That should give you enough control.
Also I might be completely miss understanding. Do you have any example figma file or example website we could look at to visualize the situation?
