React-Grid-Layout v1.6.4 Demo 25 - Flex Layout Directions

• View project on GitHub
• View this example's source
• ⇠ View the previous example: "Basic Flex Layout"
• ⇢ View the next example: "Grid ↔ Flex Drag and Drop"

This interactive demo shows how ReactFlexLayout supports all flexbox properties.

Use the controls to change direction, justifyContent, alignItems properties.

Notice how the layout responds to different flex container settings.

Try dragging items - they smoothly return to their flex positions when dropped.