Justify Content
The justify-content property in CSS is used to align flex items along the main axis of a flex container.
It helps distribute space between and around content items, enhancing layout customization.
This property is applicable only to flexbox layouts and CSS grid containers.
It's crucial for creating responsive designs by managing space distribution dynamically across various screen sizes.
Proper use improves the visual coherence and readability of layout content.
Justify Content in Workmaster
In Workmaster, the Justify Content property works the same way—it manages the alignment of child widgets within a parent container along the main axis.
To use Justify Content, the container’s Display property must first be set to Flex or Grid.
This is a Conditional Value field. Such fields allow you to specify values directly OR use a Formula to specify a value. Conditional values are useful for specifying different values for changing situations, such as varying device types or screen sizes.
Possible Values
Start
Items are packed toward the start of the flex container's main axis.
End
Items are packed toward the end of the flex container's main axis.
Center
Items are centered along the main axis.
Space Between
Items are evenly distributed; first item is at the start, last item is at the end.
Space Around
Items are evenly distributed with equal space around them.
Space Evenly
Items are distributed so that the spaces between items are equal.
Examples
1. Start


2. Center


3. End


4. Space Between


5. Space Evenly


6. Space Around


Last updated