Archived topic
columns in the wrong order on mobile and tablet
9 replies · Started by Anders on May 22, 2021
Hi! please check this page
On desktop it's 2 columns right under the header. A headline + paragraph on the left and an ordered list on the right.
On tablet and mobile it will change to 1 column. That's fine but they are in the wrong order. The headline+paragraph should appear first but instead the ordered list appear first on mobile and tablet. how to fix that?
br
Anders
Hi Anders,
Could you link us to the site in question?
You can use the private information field.
Let me know :)
oops, I forgot. see below
You've set the list container toorder: 1;, and the other container to order: 2; under tablet view.
https://www.screencast.com/t/9aX3zem5r4
You can find the settings under spacing tab.
Simply remove the order value should fix the problem :)
thanks! it helped.
Another related thing: I really need to understand how to adjust settings for different devices. For me when I make a change for mobile, the same change appears for desktop and vice versa. And that's not what I want. Do you have tutorial on this topic?
Usually tablet and mobile inherit the spacing settings from desktop settings except container width under a grid.
If you make changes to mobile, it should not affect the desktop settings.
Let me know if there's a specific case you can share.
OK, yes how can center the footer links and icon for mobile but keep left aligned for desktop and tablet?
In your footer, there're 3 GB containers, in each container there's a Paragraph block, in the paragraph block there're some links.
In this case the alignment setting of GB container will only apply to its child - Paragraph block, but not the grandchild - links.
GB has no control over the paragraph block, if I may, I would suggest using GB's headline block to add links instead of paragraph block.
Then you'll be able to control the alignment of each headline block (links) on different devices without using CSS.
thanks it helped!
Glad to hear that :)
You are welcome!