Side by Side Layout

By default, side by side layouts split available width evenly. You can use weights to assign a greater proportion of space to certain items in a layout.

The "First Name" and "Last Name" side by side items each have a weight of 4, so they take up 4x as much of the available width as the "M.I." field.

Use the "Minimize" width setting to allow a side by side item to take up only as much space as is necessary (the remaining items will split any leftover space). This configuration works best for items with a defined width, such as buttons or images with a specified size.

In this example, the "Minimize" width is applied to the avatar-style image, so it takes up as much space as it needs. The rich text item to the right of the image takes up all of the remaining width. Shrinking the image size from "Large" (top) to "Small" (bottom) shows how the "Minimize" width automatically adjusts.

NOTE: The current versions of the Appian mobile apps for iOS and Android do not yet support side by side layouts. Side by side items will be rendered as a vertical stack.

Open in Github

On This Page