[Resolved] Adjusting grid item heights on tablet and mobile

Home Forums Support [Resolved] Adjusting grid item heights on tablet and mobile

Home Forums Support Adjusting grid item heights on tablet and mobile

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #2230213
    Tom

    I am working on a website that has a 3 column grid of images with text over it and vertically centered. On desktop I have them the height I want them but when it changes to tablet and mobile I’d like the images and whole grid to become less tall and have the text remain vertically centered. So instead of them being square like on desktop, on tablet and phone they become more rectangular and take up less vertical space. Is there an easy way to do this, or should I hide the desktop grid and create a separate one for tablet and phone? Thanks – great theme and support!

    #2230227
    Fernando
    Customer Support

    Hi Tom,

    You may set the view to tablet or mobile through these Buttons when you have a Block selected: https://share.getcloudapp.com/E0uyWYxg

    Doing so should allow you to make specific spacing modifications for Desktop, Tablet and Mobile to achieve the look you’re going for.

    Hope this clarifies. 🙂

    #2231163
    Tom

    Hi Fernando – I am aware of how to target the tablet and mobile views. My question is about how to adjust the height of those grid items. I can’t seem to get the boxes shorter without going into the css and that doesn’t work that well, I’m sure there has to be an easier way. Is it a margin or padding setting? Min-height?

    #2231245
    David
    Staff
    Customer Support

    Hi there,

    the grid items ( establish, brand, build ) all have a Minimum Height of 500px which is set in the Spacing panel.

    #2231370
    Tom

    I see now – all three need to be set for the change to take effect. Thanks!

    #2231861
    David
    Staff
    Customer Support
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.