UserImage.jpg
Cuong Su
23Views
6Comments
Solved
Can not set label at the same line
Question
OutSystems 11

Hi Outsystems Community,

I am facing an issues that can not set 3 label on one line. I put that 3 label in the block and show the block in screen. But when adjust in a block I can see all of those are on one line, but when block show on screen. It's show 3 line for 3 label. Please refer for my image attached, first one is I adjusted on one line in block, second one is when I put the block into a screen. 

Anyone have any ideas to solve this one. Appreciate for all of your ideas.

Thank you!



0
0
16 Nov
Solution

Hi @Cuong Su,

You can try following ways:

  1. You can use OutSystems UI Adaptive column(columns3)as you want to add three label.
  2. Or, you can wrap each label inside the container and wrap those three container on single container. After this, add CSS display: flex; on that main container.

Hope this helps!

Regards,

See solution in context
1
0
16 Nov

It's work now, appreciate for your help

0
0
17 Nov

Hello Cuong Su,

Your objective is, when you open the program, the 3 labels are all in 1 line instead of 3? And the first example you showed you used text boxes?

The red one are text boxes and the purple are labels.

If yes, you need to adjust the labels size.

->

If not, explain how.


Best regards, 

Alexandre

1
0
16 Nov

Hi @Cuong Su,

Did you try using OutSystems UI adaptive columns? You can find the samples for all of them below - 

https://outsystemsui.outsystems.com/OutSystemsUIWebsite/PatternsOverview

If it still doesn't works then try grouping all three into one container and then placing them inside Align-Center widget of OutSystems UI. 

Let us know how it goes for you.

Thanks 

Rahul Yadav

1
0
16 Nov
Solution

Hi @Cuong Su,

You can try following ways:

  1. You can use OutSystems UI Adaptive column(columns3)as you want to add three label.
  2. Or, you can wrap each label inside the container and wrap those three container on single container. After this, add CSS display: flex; on that main container.

Hope this helps!

Regards,

1
0
16 Nov

It's work now, appreciate for your help

0
0
17 Nov

Hello @Cuong Su ,

I have tried with Outsystems adaptive column 3, this is gonna work for you as well. I am attaching the screenshot for your reference.

I used Adaptive\Columns3 and put blocks inside columns. It will work for you.

1
0
17 Nov

Hi,

Enclose all 3 labels in a container and apply classes - (display-flex align-items-center).

this will solve your issue.

hope it helps.

Thanks.

1
0
17 Nov
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.