Responsive

Responsive inline input grids adapt when the available screen width cannot display every column clearly. Enabling the responsive option keeps the grid usable on smaller screens without permanently removing data from the application.

Enable responsive behavior

1. Open the application in the Designer.
2. Select the inline input grid you want to configure.
3. Open the grid's properties and enable Responsive.
4. Preview the application at several browser widths before publishing.

The setting applies to the selected grid, so you can use different behavior for different grids in the same application. This is useful when a compact entry grid should collapse on mobile while another grid needs to preserve its full column layout.

What users see at runtime

When the grid contents no longer fit the visible area, SpreadsheetWeb collapses the columns that cannot be shown. A green plus button appears beside each affected row. Users can select that button to expand the row and view the values from the hidden columns, then collapse it again when they are finished.

The data remains part of the row; the responsive layout changes only how it is presented. Test important actions and editable fields in the expanded view so users can still complete the intended workflow on a narrow screen.

Compare the non-responsive layout

If Responsive is disabled, values that exceed a column's available width wrap inside the cell instead. Wrapping keeps all columns visible, but it can make rows much taller and harder to scan when the grid contains long text or many columns.

Choose the mode that best fits the grid's purpose. Responsive collapsing is generally easier to use on phones and compact layouts, while wrapping may be preferable when users need to compare every column at once. Preview both modes with realistic data rather than relying only on short sample values.