Flex container
Last updated
Last updated
© 2024 UI Bakery
A flex container is used as a container for a set of different components. The flex container component in UI Bakery utilizes CSS Flexbox to manage the layout of child elements. Flexbox provides advanced layout capabilities that are crucial for handling dynamic content and ensuring layouts adapt appropriately across different screen sizes.
Triggers allow you to launch certain actions based on different events.
To define fixed width component, adhere to the following steps:
Add Flex container component
Add Button component
Define the width of the Button component to 100px
You can configure fixed width and height of your child components inside of Flex container component
To add an image with fixed size and text, which should take the all free space on the right, adhere to the following steps:
Add Flex container component
Add Image and set fixed width and height
Add Text
Set fixed width
Set Grow property to 1
To align components to the right select end in the Flex justify content property
On Init
Calls for an action on component initialization