Ok, so I have this question that has been bugging me for quite a while, I'll try to explain it in detail.
I'm designing a regular marketing website, and did the desktop version first using the standard bootstrap grid (12 col, 30px gutters). I don't do code (I know I should).
Now when asked to do both tablet and mobile versions this big question came to mind. How do this grid in particular behaves at smaller resolutions? It would make sense that in iPad which is small but still a good resolution the standard of 12 columns and 30px gutter stands. This would make the website just adapt and resize some containers and it would still work.
My problem is with mobile. When we arrive at the breakpoint, do the same number of columns and gutter size stay the same? Because at 30px gutters, the columns become smaller or same size than the gutter. Or should I just make a breakpoint and erase 8 columns and only leave 4?
How should the grid then look in a PSD file aiming for mobile? Or at least, what's the best approach?