# Perspective, flex container, flex container row, image won't horizontal align with two labels **URL:** \ **Category:** Ignition\ **Created:** [April 30, 2021, 2:01pm UTC](https://forum.inductiveautomation.com/t/perspective-flex-container-flex-container-row-image-wont-horizontal-align-with-two-labels/46202 "2021-04-30T14:01:44Z")\ **Posts on this page:** 4\ **Page:** 1
**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\ **Post date:** [April 30, 2021, 2:01pm UTC](https://forum.inductiveautomation.com/t/perspective-flex-container-flex-container-row-image-wont-horizontal-align-with-two-labels/46202/1 "2021-04-30T14:01:44Z")
I have the red X from the image manager and two labels in the same flex container row For some reason the X is higher than the labels. What are some ways to adjust the height in there? I am going to generate many rows. Is it also possible to tint the background of a flex container row? Edit, got the row to color, still have alignment vertically issues ---
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [April 30, 2021, 2:47pm UTC](https://forum.inductiveautomation.com/t/perspective-flex-container-flex-container-row-image-wont-horizontal-align-with-two-labels/46202/2 "2021-04-30T14:47:23Z")
There are a couple of things to consider here: 1. You can modify the value for the `fit.mode` property of the image you have placed, but this could affect the size of the “icon”/image you’re using and distort or blur the edges. In the following screenshot I’ve set `fit.mode` to a value of “contain”. You can see the image is now centered, but it’s also a bit larger and sort of blurry. ![Screen Shot 2021-04-30 at 7.37.12 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/4/b41569f63703dac4547429a792ea210b7916ea4a.png) 1. I recommend aligning all of the items in the Flex Container to align on center by modifying a property of the flex container. Set `FlexContainer.props.alignItems` to have a value of “center”. This should avoid distorting the image and will render all components in the row with their midpoints aligned (more or less). ![Screen Shot 2021-04-30 at 7.46.04 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/f/0f488d348c24fc1c37d9db761c9a5868a8d06798.png) ---
**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\ **Post date:** [April 30, 2021, 3:12pm UTC](https://forum.inductiveautomation.com/t/perspective-flex-container-flex-container-row-image-wont-horizontal-align-with-two-labels/46202/3 "2021-04-30T15:12:26Z")
Thanks That looks good in the second option. I think I did that, except I had the text set to size 24. Does it look aligned for you still if you have the text size 24 for the labels? I was opening the page in Edge. It was more noticeable on my 1080x1240 monitor in Edge than on the designer. * * * I have a separate issue that I didn’t research yet. I have set a flex row container that is nested 3 flex containers deep to have a background that appears light blue. However, because it shows up as dark on the webpage, I am going to make and use an image that is a colored square and set to fill. I am not sure if there is a better solution, but I thought maybe I should mention it to learn more about it. Edit: I got the color thing sorted I found out the triangle has the light/dark configuration The transparency was generating 2 more digits in the RGB code and when I had that, then the color of the background came out very dark in Edge ---
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [April 30, 2021, 3:56pm UTC](https://forum.inductiveautomation.com/t/perspective-flex-container-flex-container-row-image-wont-horizontal-align-with-two-labels/46202/4 "2021-04-30T15:56:00Z")
> [@zacharyw.larson](#): > > The transparency was generating 2 more digits in the RGB code and when I had that, then the color of the background came out very dark in Edge See [Color transparency render black in Microsoft Edge Browser](http://forum.inductiveautomation.com/t/color-transparency-render-black-in-microsoft-edge-browser/29827) The issue is with Edge, not Perspective.