Log in to AnswerLog in to Follow
UserImage.jpg
Hako
25Views
7Comments
Solved
How to adjust height widget
Question
Beginner
Reactive
New to OutSystems
Application Type
Reactive

Hello, 

I would like to know how i can adjust the height of widget inside of container. 

I am using Adaptive\Column2 and put text and table each inside the placeholder, but the height is not aligned. 

I don't know how to move up the red highlight area,  or do i need to change width of the table? and how? (>_<) 

<Service Studio>

<Screen>

Thank you very much in advance!

0
0
15 Mar

Hi @Hako Vargas Ruiz

Just now I checked your OML.

As a best practice, please don't use in-line stylings.

Changes needs to do please check it below
1. Remove unnecessary in-line stylings. (which I highlighted in the below image)

Please reference the attached image.

a) before removing In-line


b) After removing In-line.

I hope this helps.

Please add comment if it helps you.


- Palle Vijay Bhaskar Reddy


See solution in context
1
0
15 Mar
2021-06-23 06-45-16
Ankit Shukla
Solution

Hako Vargas Ruiz Remove the padding from column 2 on container make it 0 px.

See solution in context
Capture.PNG

1
0
15 Mar

ok the error is observed from the editor.


Here the problem because in a column it looks a little lower is because it had a margin-top => here it is solved with a 0px.


All inside a container to make it look nice with width Fill.


why 10px width?


Now it should be OK.

The only possible problem you can have is that your table is bigger than 50% of the screen, in that case play with the size of Column 2 and 1.

You tell me greetings.
Regards

See solution in context
1
0
15 Mar

Hi Hako,

It would be easier if you share the oml or make an oml as a demo with the mentioned error, but we will try to find out what causes this.

in particular after column1 and column2 I usually put a container with width Fill

now in column 2, I see that you have a text and a table.

the text would enclose it in a container witdh Fill.


So far everything should be fine.



[IMGE 2]



Now, this image makes us believe that the table is larger in size than the container.

This could be due to the fact that a width has been set, it would be verified.

and porsiacado lock it in a container.


But the error is clear, the width of the table is greater than the column, at which point it takes the size, it would be necessary to check if it is due to a css, a style or a typed size.

Greetings.

1
0
15 Mar

Hako Vargas Ruiz Can you please share the oml for that screen only or make CSS and apply it to properties of columns in the style.

1
0
15 Mar

Thank you very much to both of you. @Ankit Shukla  @Cristian Angel Puma Villalva 

Please find the oml file attached.

Bookings.oml

0
0
15 Mar

Hi @Hako Vargas Ruiz

Just now I checked your OML.

As a best practice, please don't use in-line stylings.

Changes needs to do please check it below
1. Remove unnecessary in-line stylings. (which I highlighted in the below image)

Please reference the attached image.

a) before removing In-line


b) After removing In-line.

I hope this helps.

Please add comment if it helps you.


- Palle Vijay Bhaskar Reddy


1
0
15 Mar
2021-06-23 06-45-16
Ankit Shukla
Solution

Hako Vargas Ruiz Remove the padding from column 2 on container make it 0 px.

Capture.PNG

1
0
15 Mar

@Vijay Bhaskar Reddy Palle 

problem solved!! Thank you very much^^

I really appreciate all of your help as well.  @Cristian Angel Puma Villalva  @Ankit Shukla 

0
0
15 Mar

ok the error is observed from the editor.


Here the problem because in a column it looks a little lower is because it had a margin-top => here it is solved with a 0px.


All inside a container to make it look nice with width Fill.


why 10px width?


Now it should be OK.

The only possible problem you can have is that your table is bigger than 50% of the screen, in that case play with the size of Column 2 and 1.

You tell me greetings.
Regards

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