React-Grid-Layout v1.6.4 Demo 24 - Basic Flex Layout

• View project on GitHub
• View this example's source
• ⇠ View the previous example: "External Droppable Containers"
• ⇢ View the next example: "Flex Layout Directions"

This demonstrates the new ReactFlexLayout component using flexbox for layout.

Items are arranged using flex properties (grow, shrink, basis) instead of grid coordinates.

Every third item has flex-grow: 1 to demonstrate flexible sizing.

Try dragging items around - they will animate back to their original positions on drop.