# Numbers on gauge cut off in flex container

**URL:** <https://forum.inductiveautomation.com/t/numbers-on-gauge-cut-off-in-flex-container/116837>\
**Category:** Ignition\
**Created:** [August 19, 2026, 11:05pm UTC](https://forum.inductiveautomation.com/t/numbers-on-gauge-cut-off-in-flex-container/116837 "2026-08-19T23:05:19Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![dfox37](https://avatars.discourse-cdn.com/v4/letter/d/bc79bd/32.png) [@dfox37](https://forum.inductiveautomation.com/u/dfox37)\
**Post date:** [August 19, 2026, 11:05pm UTC](https://forum.inductiveautomation.com/t/numbers-on-gauge-cut-off-in-flex-container/116837/1 "2026-08-19T23:05:20Z")

</div>

What am I doing wrong? I want to create a simple flex container that I can repeat over and over, in it I want a label, a gauge, an LED display, and a sparkline. The label, LED, and sparkline work great. I can click on it and expand it, shrink it, doesn't matter it works. The gauge on the other hand, I either cut off the top number or the final number on the right side. If I click on the flex container and move it around until the gauge looks right everything else looks ridiculous. I've tried specific pixel column sizes, that just make it worse. I tried changing the size of the gauge and that just moves it to a different position in the container which I didn't ask for. Same with changing grow or shrink. There has to be an easy fix for this. Any ideas? Soon I'm going to have to abandon the gauge all together because I'm running out of design time.

---

<div class="post-metadata">

**Author:** ![bobby.miller](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bobby.miller/32/85153_2.png) [@bobby.miller](https://forum.inductiveautomation.com/u/bobby.miller)\
**Post date:** [August 19, 2026, 11:23pm UTC](https://forum.inductiveautomation.com/t/numbers-on-gauge-cut-off-in-flex-container/116837/2 "2026-08-19T23:23:56Z")

</div>

Try reducing `props.outerAxis.percentRadius` from 100 to something like 80-90 so the axis labels have room? and reduce `props.style.fontSize` maybe.

Otherwise, what's your basis/shrink?

---

<div class="post-metadata">

**Author:** ![dfox37](https://avatars.discourse-cdn.com/v4/letter/d/bc79bd/32.png) [@dfox37](https://forum.inductiveautomation.com/u/dfox37)\
**Post date:** [August 19, 2026, 11:37pm UTC](https://forum.inductiveautomation.com/t/numbers-on-gauge-cut-off-in-flex-container/116837/3 "2026-08-19T23:37:48Z")

</div>

Thanks Bobby. Reducing percentRadius really helped. Adjusting fontSize helped too. Currently basis is 175px and shrink is 1. Once I get one flex container the way I want it, I need to make eight of them fit on the screen plus other smaller containers with just numeric displays. So the overall container may shrink some.
