Jump to content
View in the app

A better way to browse. Learn more.

Invision Community

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Grid/Wallpaper Layout - How to maintain consistent items per row while filling full width?

Featured Replies

I'm building a home page in IPB5 and need help with the Grid/Wallpaper widget layout settings.

Goal: Display 3 event blocks per row that fill the full width of the container. When the viewport shrinks, I want the blocks to resize proportionally while staying on the same row (not wrapping to a new line).

Current Issue: I can't achieve both requirements simultaneously:

  • If I set each block width to ~33% to fill the full width, one block wraps to a second row

  • If I reduce the block width to prevent wrapping, the blocks no longer fill the full width and leave empty space

Question: What widget settings or configuration will allow the blocks to:

  1. Always display 3 items per row (no wrapping)

  2. Fill the full available width

  3. Resize responsively when the viewport narrows

Is this achievable through the widget settings, or does it require custom CSS? Any guidance would be appreciated.

  • Community Expert

There is no function within the software that will allow for this. It will always wrap where needed, as this is part of the softwares responsive design. You would likely need quite a bit of customisation to achieve this.

  • Author

When i look at the home page at https://invisioncommunity.com/ i can see the "Seamless integration with your workflows" that contains three items and it only gets reduced to two items in the row when the width drops to "Tablet" level. As I can create a different block for Tablet or Mobile, is there a way to delay the collapse? Is there a way to center the cards within the block?

Steve

  • Community Expert
15 hours ago, 2002faq said:

When i look at the home page at https://invisioncommunity.com/ i can see the "Seamless integration with your workflows" that contains three items and it only gets reduced to two items in the row when the width drops to "Tablet" level. As I can create a different block for Tablet or Mobile, is there a way to delay the collapse? Is there a way to center the cards within the block?

Steve

There isnt a built in way to achieve this. Please bear in mind that the home page of our site is very custom built

Recently Browsing 0

  • No registered users viewing this page.

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.