Passing CSS values as Parameters

Hi, I am struggling to make my CSS parameters work, after plenty of RTFM.
I have set these parameters for the button (component) labelled “Click Me”:

{… previous parameters work fine, sintax is fine, but CSS does nothing },
“cssCode” : {
“label” : “Styles”,
“type” : “group”,
“params” : {
“margin-top” : { “type” : “size”, “initial” : “0” },
“margin-bottom” : { “type” : “size”, “initial” : “0” },
“margin-left” : {… same },
“margin-right” : {… same }
}}}

This is waiting at the element’s Customize (CSS)

$el {
margin-top: {{dc:p:margin-top}};
margin-bottom: {{dc:p:margin-bottom}};
margin-left: {{dc:p:margin-left}};
margin-right: {{dc:p:margin-right}};
}

What am I doing wrong?

Thanks for your attention and helpful advise.

Since you’re using these parameters inside a group it would be the following dynamic content {{dc:p:cssCode.margin-top}} and so forth with your other margin parameters. Utilizing cssCode (the group key) with a dot before the parameter name. Have a great day.

Got it working, thanks for your advise!
I see that instead of margins, I needed to set position(relative) top and left.
Altogether, exactly what I was looking for.

1 Like

Hey Ricard,

You’re most welcome!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.