177
Views
4
Comments
Solved
How to change element.style from HTML in CSS at Outsystems? Is possible?
Application Type
Mobile

Hello everybody.


I'm trying to change the default margin-top of the dropdown widget, but the style is applied inline in the HTML DIV tag.

 How can I edit this, since in principle we can only edit the CSS? 

Thank you in advance for any help. Thanks

2024-09-12 02-43-38
Deepsagar Dubey
Solution

Hi Carlos.

As i understood, you want to put custom CSS on your dropdown container (DIV), here is few options to do this -

1. if you want to apply custom CSS on multiple elements then create a class and add it in your elements. Double click on your theme and create CSS classes on module level.


2. If you want to apply CSS only on one element then in container properties select style attribute and in value put your CSS, but its recommended to use CSS classes instead of inline CSS.


Additionally if you only want to change margin top then you can do it from here as well.


I hope it'll help you.

Thanks
Deep

2026-02-26 06-29-24
Rahul
 
MVP
Solution

Hi @CARLOS GUIMARÃES ,

The valid property of CSS for margin-top: 0px or margin-top : 0 

Not margin-top: none.


Regards

Rahul

UserImage.jpg
SSP
Solution

Hi,

You can either create your own class or Outsytems defined classes. On dropdown you can add extra class example: "margin-top-s" or custom class.



This will change margin top of dropdown widget.

Hope this help!


Thanks,

SP

2024-09-12 02-43-38
Deepsagar Dubey
Solution

Hi Carlos.

As i understood, you want to put custom CSS on your dropdown container (DIV), here is few options to do this -

1. if you want to apply custom CSS on multiple elements then create a class and add it in your elements. Double click on your theme and create CSS classes on module level.


2. If you want to apply CSS only on one element then in container properties select style attribute and in value put your CSS, but its recommended to use CSS classes instead of inline CSS.


Additionally if you only want to change margin top then you can do it from here as well.


I hope it'll help you.

Thanks
Deep

2026-02-26 06-29-24
Rahul
 
MVP
Solution

Hi @CARLOS GUIMARÃES ,

The valid property of CSS for margin-top: 0px or margin-top : 0 

Not margin-top: none.


Regards

Rahul

UserImage.jpg
SSP
Solution

Hi,

You can either create your own class or Outsytems defined classes. On dropdown you can add extra class example: "margin-top-s" or custom class.



This will change margin top of dropdown widget.

Hope this help!


Thanks,

SP

2022-05-06 13-22-54
CARLOS GUIMARÃES

Guys, I appreciate your assistance. I was confuse. I thought that I couldn’t edite widget structures, but just your look feel. Thanks for everybody.

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