Issue with resizing switch and dropdown widget
Application Type

I am observing some issue with widgets like switch and dropdown resizing. If I resize these widget height from default to say 30px it does not adjust the size properly. I have seen by modifying few pseudo style it can be resized but that is tedious and slows down the development. Can anyone suggest how to handle this. Attaching a sample app where the switch widget height does not change as I set.


Hello Biswajit,

I referred your oml file. To adjust switch/dropdown widget size enclosed it into a container and then accordingly adjust widget layout height.

I hope this helps you:)



Hi Rasika,

Thanks, I enclosed switch widget in a container and changed height of both container and widget but this does not help. Could you please share sample oml if it is working at your end.

Hi @Biswajit Kayal ,

To resize the widget apply the below styles 


[data-switch]:empty:before {
    height: 20px;

[data-switch]:empty:after {
    height: 14px;
    width: 20px;


[data-dropdown] > div.dropdown-display {
    height: 40px;
// For dropdown arrow
.dropdown-container:after {




Hi @Harika Ramadalai ,

Thanks, I already used this styling for pseudo elements. But I am looking for something quickly we can do for this kind of scenario. In order to overriding the styling for this pseudo element, we need to identify it which basically slows down the development of a RAPID application development platform. Or is this the only way we can do this?

Hi Biswajit Kayal,

Kindly refer the attached oml and Url.

Hope this helps!




Hi Ellakkiya,

I was looking for something other than styling pseudo elements in the widget. Identifying and then overriding the style is a bit tedious with respect to a RAPID application development platform.

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