Amol Rane
Rank: #1740
13Views
1Comments
Solved
Custom height for input widget.
Question
Mobile
OutSystems 11
OutSystems UI
OutSystems Widgets

What is the correct way to change the height and background of an input widget in mobile app?

If I change it in the screen style sheet as 

.tablet .form-control[data-input], 
.tablet .form-control[data-textarea],
.phone .form-control[data-input], 
.phone .form-control[data-textarea]
{
    height: 42px;
}

Then, for Iphone, the text prompt is moving up, shown below.

And this does not happen for all the mobiles, only Iphone X(as of now). Please tell me what the correct way to change this is, as adding a css class does not work out.

0
0
on 2nd Feb
Copy link to comment
Kadu Borges
Rank: #541
Solution

Hi Amol, 

I think that the problem is with the line-height style property.

You can set it to the same value as you put in height.

.tablet .form-control[data-input], 
.tablet .form-control[data-textarea],
.phone .form-control[data-input], 
.phone .form-control[data-textarea]
{
    height: 42px;
    line-height: 42px;
}

Hope it helps.

Best regards

2
0
on 2nd Feb
Copy link to comment