Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • Specify a fixed size in pixels.
    Set Position Settings → Width and Height with valuepx.
  • Specify a size that varies as the screen resizes and always occupies the same proportion of space. 
    Set a percentage in Position Settings → Width and Height with value%.
  • Allow the layout component to automatically expand to fit the visible space on screen.
    Set Style Settings → Auto Size ticked.
    • If the layout component has siblings (components at the same level) they share the space in the flow direction equally.
      (To specify the flow direction, in the parent component set Style Settings  → Direction.)
    • Child components may need more space than is available. For example, they may contain more fields than will fit on a screen. In this case the fields will extend outside the boundaries of the parent area.
  • Control how much a layout component will expand compared to its siblings using a ratio. 
    Set a Style Settings → Grow Factor. For example, enter 2 to allow a component to take up twice the space as its siblings.
  • Allow layout components to expand to the space they need, pushing the parent container to expand beyond the screen.
    Set Style Settings → Auto Size unticked.
    Remember to enable scroll bars on the parent container using Style Settings → Show Horizontal Scrollbar and Show Vertical Scrollbar.
  • Allow a layout component to change it's size within a minimum and/or maximum range.
    In CSS Properties set CSS Tag: min-height or max-height and Value: valuepx.

The following video shows how the different settings affect layout components in a dashboard.

...