I'm having problems setting margin-left in Style Properties in Service Studio.
When I try to use margin-left: var(--space-m), the rule is completely ignored.
It works fine if I hard-code a value, for example margin-left: 20px;
Is there a good work-around for this, other than creating a css class?
Thank you.
Actual Platform Version: 11.7.3.7036 Internal Version
Actual Development Environment Version: 11.7.1.15066
Hi Brynleif Andreasen ,
i tried this css and get same result and after finding some research i got it why this happen,
1.when use this css on container there is no space for left so it will only take margin-top property.
2 when use this css inside container text, it will not take Margin-top property because there is no top space.
3. when use css inside container text than you will see it will auto adjust css like
if you put
margin-top: var(--space-m);
margin-left: var(--space-m);
than click outside it will auto adjust and you will see in css property
More info related this type css-
https://basscss.com/v7/docs/white-space/
Hope this will help you.
Regards
Rahul Sahu
Rahul Sahu wrote:
Thank you for the reply! This answers my question, so I will mark it as a solution.
However, I am still wondering why OutSystems has this behavior when I am using css variables and not when I am using hard coded values.
Let me quickly add that I'm using Traditional Web.
Can you share image of element where and how to use this css.
you can use.
.ClassName{
margin-left: 20px !important;
}
Thanks for the reply Rahul Sahu! Certainly your solution will work, but I was looking for an even easier way to do it.
I can show you images of what I mean.
I set this CSS on a container: margin-top: var(--space-m) and margin-left: var(--space-m)
This is what the selected container looks like in Service Studio:
You can see that only the top margin is visible, and it is the same when I publish the page:
Can you see? margin-left is simply not in the page.
Do you know why this is happening?
I am also wondering for this weird bevaviour . i will find something on this and let you know .