Issue
We have created a content page that contains a grid with 3 modules and it displays 3 modules per row in desktop mode.
We need to only display 2 modules per row in tablet mode but Liferay doesn't allow configuring 2 Modules per Row, this option is not displayed in the Style drop-down when you have 3 modules.
Why does this limitation exist? Is there any workaround?
Environment
- Liferay DXP 7.3
- Liferay DXP 7.4
Resolution
- What is the solution? Be clear, concise, correct
Additional Information
Configuring 2 modules per row when having a 3 module grid is not allowed because you cannot distribute 3 Modules in 2 rows with 2 modules per row as you will have an empty space.
As a workaround, if you don't mind having an empty space, you can configure it by following these steps:
- Create only 1 grid with 6 modules.
- For desktop mode, define 3 modules per row.
- For tablet mode, define 2 modules per row.
- Add the desired content only to the initial 3 modules, leaving the other 3 empty.
This option will allow displaying the desired columns in each desktop/tablet mode.
There is a small drawback: there will be empty div containers (the remaining empty modules), but that should have no impact on the UI