Hello everyone,
Looking for a bit of help or some insight. I have a Lottie animation that I’ve uploaded into Webflow and it shows the animation having a tiny margin/padding on the top and bottom. I’ve re-exported a couple of times from AE and re-uploaded to WF. I’ve also checked it in LottieFiles and everywhere else and it looks as it should. It seems to be only there in Webflow.
In the screenshot below you can see the padding on top of this Lottie animation as it sits inside a div with a 1px stroke. The div is a flex child with no spacing set. When this flex-child-div (that’s housing the lottie file) its set to “shrink” or “stretch” the margin is present, but when the sizing is not set to shrink or grow, the animation takes the entire width of the frame. Looks good, but of course that’s not flexible at all.
Nothing happens when I mess the the Alignment for the div housing lottie file. I do get a change when I adjust the alignment of the lottie file itself, and the only thing that changes is that the lottie file fills the top margin creating a larger one at the bottom if I choose the alignment settings: top, bottom, or center.
Can anyone shed some light? It’s a tiny, but frustrating little thing.
Thank you in advance.