# Title in Flex Container **URL:** \ **Category:** Ignition\ **Tags:** vision, perspective\ **Created:** [October 4, 2024, 12:42pm UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822 "2024-10-04T12:42:38Z")\ **Posts on this page:** 11\ **Page:** 1
**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\ **Post date:** [October 4, 2024, 12:42pm UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/1 "2024-10-04T12:42:38Z")
I just added a label inside a Flex Container tos how the tittle ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/d/2d61245738251feb49fcf6c8dcc339dd344dd5fb.png) In vision you could add tittles: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/c/bc22a6ac9c8fd2cf02cd6a2afbaf09fda0bcb1c3.png) Is there other way to do it in perspective? If no I stick with the label. Cheers ---
**Author:** ![YF129701](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/yf129701/32/60498_2.png) [@YF129701](https://forum.inductiveautomation.com/u/YF129701)\ **Post date:** [October 4, 2024, 1:05pm UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/2 "2024-10-04T13:05:45Z")
There is no other way to give a Flex Container a title so you would have to use a Label, yes. ---
**Author:** ![Benjamin\_Furlani](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/benjamin_furlani/32/66084_2.png) [@Benjamin\_Furlani](https://forum.inductiveautomation.com/u/Benjamin_Furlani)\ **Post date:** [October 4, 2024, 1:14pm UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/3 "2024-10-04T13:14:54Z")
You can achieve the same thing using css styling. you need the border and some absolute positioning for the label and set zindex properly. a good example of some css on this ( you can mostly ignore the html, but the classes need to be properly applied to parents and components) > ---
**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\ **Post date:** [October 4, 2024, 1:24pm UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/4 "2024-10-04T13:24:14Z")
Thank you guys, will try with the absolute positioning for the label. Cheers. ---
**Author:** ![msteele](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/msteele/32/77889_2.png) [@msteele](https://forum.inductiveautomation.com/u/msteele)\ **Post date:** [October 4, 2024, 1:34pm UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/5 "2024-10-04T13:34:06Z")
You can also just nest your flex row container containing the checkboxes inside a flex column container. Style the flex column container to have a border or show up as a surface, which you can do either via css or via the style editor when the flexbox is selected. Then drop in a label in your flex column container above the flex row container. ---
**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\ **Post date:** [October 4, 2024, 1:39pm UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/6 "2024-10-04T13:39:10Z")
Good idea! ---
**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\ **Post date:** [October 7, 2024, 9:36am UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/7 "2024-10-07T09:36:23Z")
Thanks guys, is working, for this solution just added a label on the flex container with an absolute position with margin top 0 as one of the solutions proposed ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/4/84309e7913b5fd22078ed60e2e6ed9ba191c4f1b.png) ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/f/5f3a8bfbe01e0f768fcdbec1305ddc2cdd9235ef.png) ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [October 7, 2024, 11:15am UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/8 "2024-10-07T11:15:06Z")
There is a css solution for this, but that looks better with less effort 😛 I suggest you add a style `gap:5px` to your flex reptear btw, and maybe reduce the spacing between the label and checkbox ---
**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\ **Post date:** [October 7, 2024, 11:20am UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/9 "2024-10-07T11:20:57Z")
> [@victordcq](#): > > gap:5px adding the gap make the checkboxes look much better, thanks! ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [October 7, 2024, 11:31am UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/10 "2024-10-07T11:31:07Z")
Giving the a class like `checkboxNoPadding` to the checkbox and adding this css tot he stylesheet. It will also reduce the padding between checkbox and label. ```python .psc-checkboxNoPadding.ia_checkboxComponent .checkbox-input-label--right{ padding-left: 1px; } ``` for a list of checkboxes like that the padding should really make it clear which label is with which box ---
**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\ **Post date:** [October 7, 2024, 11:36am UTC](https://forum.inductiveautomation.com/t/title-in-flex-container/96822/11 "2024-10-07T11:36:03Z")
Thanks Victor!, yes the gap already help a lot making clear wich label goes with wich box. I will try this extra bit css too. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/e/b/ebca6bffb33507cf26acc999423f2c1530bb7d26.png)