They are the Separator lines in the Outer RG. That is why I had it set to horizontal scrolling and four columns. You changed that and I’m not sure but I’m guessing it is because you want it to change the number of columns based on page width. Am I correct in that assumption?
Yes, down to one column on mobile.
Grab a screenshot of the element inspector for the outer RG please.
As I said it is the outer RG that is the problem. Can you upload a screengrab of the element properties for it please.
So the Ext Vertical scrolling makes the Outer RG create blank rows for the items it knows exist but for which you have no text field to display them. In effect you are loading the data into the Outer and then loading it into the Inner.
My brain cells are overheating on this one. What you want is to dynamically set the number of columns based on screen width. Whilst it is possible to use CSS tools to change an element’s size, it is not possible to set an RG’s number of rows and columns dynamically. I fear the only solution is for you to make 2, 3 or 4 RGs, each with a different number of columns, and set a condition (using the CSS Tools Plugin) to determine which RG is visible. For example:
WHEN CSS Tool’s Page Width is <400 THEN use a conditional to make RG 1 Column visible.
Alternatively, you can remove the bit of code that hides the scroll bar and let the user scroll horizontally - will not look great but it is the fastest solution. Building multiple RGs and using conditionals will take longer to set up but will look a lot better.
Yes, that is what I was thinking. Thanks for for your help!
Glad I could help. I spent days struggling with a similar conundrum last week which is why I know what’s possible and what’s not.
I’ll get back to you if I figure out a better way.
This topic was automatically closed after 70 days. New replies are no longer allowed.