A flexbox is a container that holds components together for the sake of usability. In a user interface, a flexbox often serves to group related components in a neat and orderly way.
Without a container, app design can spill over into other margins, or generally appear unorganized. Containers as a whole solve this problem by specifying container dimensions, and allowing the content within the container to be displayed consistently in a predetermined manner.
Remember, a flexbox itself is a wrapper for components. It allows several ways of organizing components. Basic CSS offers several flex-direction values to choose from:
.Flexboxes also allow for additional CSS like padding, wrapping, growing, and shrinking, to further customize the way components are displayed.
In Internal, any connected data source automatically generates numerous components to use in your workspace, including flexboxes.
After dragging and dropping a flexbox into a space, other components can be dragged into it and arranged a number of ways. From a dropdown menu, users can choose flex direction (row and column), spacing, padding, and so on. It’s a remarkably fast and easy way to group components, so that users don’t have to write CSS every time they want to group components together within a workspace.
Check out the Internal flexbox component documentation for more information, or help with creating your own.
Mozilla: Flexbox fundamentals
W3 Schools: CSS Flexboxes