Mashup Flexible Containers Resolution Issue

Forum|Forum|5 years ago
July 7, 2020
1 reply
1676 views

Hello everyone,

I'm new to the front-end side of development regarding ThingWorx. Recently we had an issue on our Mashups.

We use a 'Master Mashup' (Header Only) to create a 'Navigation Bar' so we can navigate between our dashboards.

The 'Master Mashup' Header (Flex Container) is set to Grow and Shrink all nested containers. And this is working accordingly (child containers are resized accordingly). However, we have some 'Label' widgets inside those child containers whose dimensions are set in a static manner (for e.g. Width and Height '50' px).

For some resolutions (For e.g. FULL HD) we have no issues. However, if we keep decreasing the resolution we note that the 'Label' widgets do not Grow/Shrink accordingly, and this is causing some deforming to occur.

Any pointers on how to make the 'Label' widget resize itself accordingly?

Best regards

Best answer by tmisner

Hello rnfonseca,

The Label Widget is Static and thus the font size is non-responsive. The only suggestion would be a custom solution by setting the font size via CSS. I do not have a great deal of experience with CSS but was able to find the following Community Post which may be helpful:

How can I change my font size to responsive

T

tmisner

Answer

16-Pearl

Hello rnfonseca,

The Label Widget is Static and thus the font size is non-responsive. The only suggestion would be a custom solution by setting the font size via CSS. I do not have a great deal of experience with CSS but was able to find the following Community Post which may be helpful:

How can I change my font size to responsive

R

rnfonseca

Author

1-Visitor

Hello @tmisner ,

I suspected that I would have to have CSS customization brought to the table. Thank you for the quick answer!

Sign up

Please use your PTC eSupport account.

Welcome to the PTC Community

Please use your PTC eSupport account.

Scanning file for viruses.

This file cannot be downloaded