Automatic layout is a game-changer for responsive design. It creates dynamic relationships between elements, allowing them to adjust their position and spacing as the screen size changes.
Automatic Layout Example #
Let’s say you have an image and some text. With automatic layout, you can ensure they always stay aligned and properly spaced, even when the screen shrinks, creating a cohesive look across all devices.
Controls how elements align within their container (e.g., top, center, bottom).
Determines the flow of elements—whether they stack vertically (top to bottom) or horizontally (left to right).
Sets the spacing between elements. You can control horizontal and vertical gaps independently.
Adds spacing between the elements and the edges of their container, add separately to each axis.
Advanced automatic layout for responsive design #
Flowmo’s pro features unlock a new level of control over element behavior.
Maximum Width Example #
Set a maximum width for an image so it scales proportionally but never exceeds a certain size, preventing it from breaking your layout on smaller screens.
Define a minimum and maximum font size for text to ensure it’s always readable on larger displays.