For the managed package runtime, set the height and width, and configure the responsiveness of a Flexcard element within the Flexcard Designer. In addition to adjusting the width of an element by clicking and moving its drag markers left and right on the canvas, use a slider on the Style panel to adjust the width.
This information is for Omnistudio for Managed Packages. For Omnistudio on standard runtime, see Omnistudio Help.
Configure the height, minimum height, and maximum height of the element using CSS supported values. See Adjust the Height of an Element on a Flexcard (Managed Package).
Enable responsiveness on one or more elements to set the width to change as the width of the visable area of a page, called the viewport, changes. See Create Responsive Elements on a Flexcard (Managed Package).
The responsive sizing of elements is mobile-first. Sizing starts at the smallest visible viewport breakpoint and is continuously applied upwards until the next wider breakpoint overrides it. When responsiveness is enabled, the default width becomes the width of the smallest viewport breakpoint. See Flexcards Element Responsiveness (Managed Package).
- Flexcards Element Dimensions Properties (Managed Package)
For the managed package runtime, an element's Dimensions properties are configurable from the Style panel in the Flexcard Designer when an element is selected. Update the height and width, and configure responsiveness for your element. - Adjust the Height of an Element on a Flexcard (Managed Package)
For the managed package runtime, update the height of an element on a Flexcard from the Style panel in the Flexcard Designer. Enter any CSS supported values, such as length units (px,cm, and so on),inherit,auto, and so forth. Or enter a CSS function, such ascalc(2em * 5). - Adjust the Width of an Element on a Flexcard (Managed Package)
For the managed package runtime, after dragging an element from the Build panel into a state, adjust its width along a 12-column horizontal grid. The width of an element is 1 to 12 parts of a 12 column grid. For example, a field element that is 6 columns wide takes up 50% of the available horizontal space. - Flexcards Element Responsiveness (Managed Package)
For the managed package runtime, in the Flexcard Designer, enable responsiveness on one or more elements to set the width to change as the visible area of a page, called the viewport, changes. By default, the width of an element is the same regardless of the width of the viewport device on which the user views the Flexcard. The width of an element is 1 to 12 parts of a 12 column grid. For example, a field element that is 6 columns wide takes up 50% of the available horizontal space. - Create Responsive Elements on a Flexcard (Managed Package)
For the managed package runtime, enable an element's width to change when the viewport updates. For example, make the widths of the fields for First Name and Last Name of a Contact take the full width of the page on smaller devices, but shrink to 50% on larger devices such as laptops and desktops.