How do I center footer widgets for tablet and mobile?

Hi Gabriel,

Try this CSS:

@media (max-width: 1024px) {
    .footer-bar-align-right .copyright-bar {
        margin-left: auto;
    }
}

That's a start but it's still not working correctly. Check out the mobile screenshot - https://tinyurl.com/y99h9u6u - and look at the four images above the footer and then the footer images. Needs to look better.

Thanks for your help.

The footer content is now centered, isn't it? :)

If so, can you open a new topic for other questions? Thanks!

Quick tip on the image question, check each grid container's margin settings on mobile.

Hi Ying,
No it's still not centered. You can see that the first item is not centered at all.
Please help.
THanks,
Gabe

Hi Gabriel,

You can try editing the Container Blocks and give them a 100% width on Mobile view as such: https://share.getcloudapp.com/wbuzb9yo

Then if you wish to add spacing, you may add margins as such: https://share.getcloudapp.com/L1uRrNPr

This in turn would center the image on Mobile view. As shown, you may also set the min-height here or set paddings to achieve the look you’re going for.

You may also do as such for Tablet.

Hope this clarifies. :)

Thanks Fernando. That's a helpful start. Still having problems with the four images on the home page. I don't understand why they aren't evenly aligned since they are all exactly the same size.

https://tinyurl.com/ycsv9q7t - tablet view
https://tinyurl.com/y72w8c4d - mobile view
https://tinyurl.com/yaorr3g3 - full desktop view

Hi Gabriel,

In the tablet mode, select the Grid block, set its vertical alignment to default instead of center.