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

Technical Q&A
1

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!

2

@fm_vlv

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

3

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

4

Sorry, we didn’t go public yet. I’d still be grateful for any helpful input :folded_hands:

5

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

6

Anyway, you can provide a screen shot?

7

Unbenannt.JPG
Unbenannt.JPG1914×900 238 KB

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.

8

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

9

Nope. It’s based on the free “Refresh” - I believe …

10

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

11

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!