I know you can set percentages for margins (Flexible fill mode) but is there any way to set a dynamic margin based on screen width? I’m referring to the percentage of margin changing. The wider the screen the higher percentage of margin.
The result I’m looking for is no margin on phones (zero percent) and larger margins as screen widens (25% margin on wide screen.)
Any Stacks3 stack to do this? CSS?
I know this could be done with break points… but is it possible dynamically across variable widths?
It’s very praiseworthy that Tav addressed that on his end, but I think this should be a standard feature of Stacks in general, because breakpoints are not very accurate and reliable and they vary from one device to another (of the same kind).
Well, I was referring to left and right margins… not top and bottome (as you show) but Sections Pro does have separate mobile settings for Width and Padding which helps. Thanks Lisa.
It does also have horizontal settings. I just didn’t click that tab for the screenshot. I am using it with Foundation. Agree, though it would be nice if RW had those settings.
@1611mac This is exactly what my PADDDYCol and PADDYColPad stacks do. To do this correctly, breakpoints are needed to adjust that % side padding because the 3 device sized screens each have very different requirements. In addition you usually need to set a maximum width. I found that % side padding needs to be increased for large mobile size yet reduced (but never removed) for small mobiles. IMHO I doesn’t look right to see all content grow to fill a 640 or 768 width screen when you need more % padding to make it look right and balanced. It is also important for images because as they go full width, they can grow too high and end up making a mobile page too long.
The PADDY stacks are included with all of my Templates and Projects.
