How can I manage spaces and sizes in Outsystems?
Question

How can I manage spaces and sizes in Outsystems?

hello guys! I'm a newbie in Outsystems and I was wondering how can I manage space and size in the app.

I've try to press enter but it doesn't work (it cleand my canvas).

What can I do to insert spaces between gadgets?

Solution

You can use the spacing classes from the OutSystemsUI Theme

Check the spacing classes in this link that OutSystemsUI provides.

https://outsystemsui.outsystems.com/StyleGuidePreview/Spacing

Then you just need to put the class on the style classes of the element

If you want to give a bottom space, you need to use margin-bottom as I did here, where I am giving a space of 24px to the bottom of the element that I am giving the class.

For the heights, you can use the height property on the styles, which I don't recommend, or use padding as you do for spacings or you can create custom classes to give min heights or heights, but remember if you give a heigh it will be a static measure, you can always do min-height. You can check at the same link(above) the padding classes to apply.

https://www.w3schools.com/csS/css_padding.asp

Regards,

Márcio

Thank u for your insights! I'll try this soon!

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