I have created a custom component in Retoll following the guide, but I am trying to figure out a way to disable the margin and padding for this component. The custom CSS for my component is not working, and the spacing option in Retoll is also not working.
Is there a way I can control the spacing for custom components?
Hi @irfanullah,
If you set the height to Auto, you can control the margin. Hover on the space just to the left of "normal" and click on FX to set margin manually.
I have tried, but no luck. Even with the height set to auto and margin set to 0, I am not able to get rid of the space around it.
@irfanullah,
Okay, so I was able to remove all my padding and margins with a bunch of custom css.
Here is the css:
Your class and id names will be different:
I THINK it will be <name of your custom component>--0-iframe for the id
and hopefully the containing div will be the same as mine: _margin_zygox_1.
If not, go to your developer tools and find the id in the iframe tag. Then set your margin and padding as I did above. Then find the containing div which contains for divs and then the span containing the iframe. Use the classname on this div.
@lindakwoo thanks for pointing this out. The custom CSS solution works, but in my case, removing the spacing by adjusting the margin and padding on the iframe ID didn't work. Instead, using the following:
._margin_zygox_1 {
padding: 0;
}
worked. However, there was one other issue: all the custom components of different types were receiving the same class, so the padding affected all of them. I had to use the :has selector to resolve this. Thanks again—it worked!
Hey @irfanullah
you can also use the css in main page and in image:
When you are using css none in image and in main page its working perfectly.
@WidleStudioLLP Thanks so much! This is great. I was actually looking for a custom component, but I managed to solve it using custom CSS as mentioned by @lindakwoo. 
