Can't get my columns (stack) to behave in responsive theme


(JWS) #1

I could really use hand figuring out why these columns are behaving so oddly in the intermediate (Portrait iPad) width. At standard screen with, they are as predicted – five aligned columns; they also behave in smallest (iPhone) width – they stack on each other. In the intermediate (think Portrait iPad) they align in this very odd way.

In the linked page – Draft page with examples of problem – I’m using two different columns stacks (the standard Rapidweaver one and the responsive grid by 1LD. The problem recurs either way.

Why don’t they just stack two by two by one? I could really use some help. (I know this overlaps with a lot of topics on responsive themes, but I am really struggling with this weird problem.)

Additional details: I’m using Lander Theme included in Rapidweaver 7 and I have found the problem in Safari, Chrome, and Firefox on Macbook, iMac, and two iPads.

Thanks in advance for any help.

JW


(Stuart) #2

I think the problem is a 1% right margin in the column stack which is throwing the dual alignment out. I do not know that stack… is there a setting in the UI for it to turn that 1% right margin off? We could scape up some CSS to override it, but much better if the stack can be adjusted through the UI.


(Isaiah Carew) #3

Maybe you already fixed it? But when I look at the link provided things look pretty good at iPad widths. This is Safari and Chrome. Perhaps you are looking at some cached content? Maybe clear and disable caches.


(Stuart) #4

Interesting. Not for me in Chrome:

And with the margins turned off in the stack:-


(JWS) #5

Thanks so much. That was incredibly helpful. I really appreciate it.