Problems with CSS property "scale" - Online Store editor can't be published

[fm_vlv]

Is someone else also having problems with applying the "scale" property in the editor's "Custom CSS"?

I was trying to scale up the social media icons in the footer: .footer__list-social { scale: 1.2;} and create a little animation on hover over our logo: img {transition-duration: 1s;} img:hover {scale: 1.08;}. It correctly displays in the editor, but I can't save the changes anymore. I instead receive the error message: "Online Store editor can't be published".

Any ideas how to make it work or how to create the same results without using "scale"??

Thanks in advance!

[shreyhweb]

@fm_vlv 

please share the store URL and let us know where to put animation? then we will able to help you.

[fm_vlv]

Sorry, we didn't go public yet. I'd still be grateful for any helpful input 🙏

[made4Uo]

Hi @fm_vlv 

I do not think it was the scale css, I was able to use scale in the custom css. You might want to refresh your browser. Try using incognito browser and if the problem still persist

[fm_vlv]

That's odd. I've tried it with Firefox & Edge both in normal & incognito mode. The problem persists. Any other ideas??

[made4Uo]

Anyway, you can provide a screen shot?

[fm_vlv]

My latest try, simply to see whether the problem also persists if I just try to scale up simple headline text in the body. Apparently it does persist.

[made4Uo]

Oh. Do you have a paid theme? or a copy of paid theme?

[fm_vlv]

Nope. It's based on the free "Refresh" - I believe ...

[made4Uo]

Looks like the theme is corrupted. Can you duplicate the theme, and do some adjustments on the copy? See if that fix it

[fm_vlv · Accepted solution]

Didn't change anything. I believe I was able to fix it myself. It was just a syntax problem: I now use scale together with transform -> img:hover {transform: scale(2);}. Seems to be working out now. Thx anyways for the fast replies!