Global.css stopped working for new lines of code (but still processes the older ones!)

[Helene_CHARBONNIER]

I’m having trouble with
global.css!
Hi! I’m working on a personal website and was using the global.css to customize some elements (adding multiple shadows, animations etc) until it simply stopped working a few hours ago. I don’t see what I did wrong. The styles and interactions I entered earlier are still processed and working, but all the new ones I entered below a certain point aren’t.

Working in
Wix Studio Editor, global.css.

What I’m trying to do
Right now, I’m just trying to add a shadow to my card component. Ultimately it will be a multiple shadow effects, hence using CSS customization, but for the sake of testing and visibility, for now it is just a brutal black hard shadow.

What I’ve tried so far
• Using the ID - in this case: #Card
• Using a CSS class: .card
• Adding !important
• I tried on other components as well, in different areas in the website (header, top of the page, bottom…), still trying ID then CSS class, nothing works, the CSS won’t be added.
• I tried to change background colors to some obvious ones such as background: lime; but it still doesn’t apply.
• Deleted my CSS and JavaScript lines of code I wrote up to when it was still working, in case I had something blocking the global.css or preventing it to get updated. I almost lost them btw… The undo button did not bring them back… I’m glad I copy-pasted them on a Pages document before!
• With or without shadow applied through the Design Panel.
• I placed the new code first, at the very top of the global.css page thinking that maybe after a certain number of line, it stops processing. But it didn’t change anything.
• I created an HTML embed styled selector (thank you, ChatGPT) to enter some CSS with a tag into a HTML embed widget. Didn’t work.
• After creating CSS classes, when I select the element, check the path, I see “referenced in code”. I click on it and it takes me to the CSS lines I wrote so I know they are properly connected. But the style won’t apply.
• Of course I check if it’s being processed in the live version only but nope!

I am sure I tried more things but can’t remember at this point and I don’t what else I can do.

Extra context
Here is a screenshot:

All the parent containers are set on overflow: visible and I tried also on basic containers without any content and only one section as a parent and I got the same results.

Here I tried changing the orange container’s background:

Still nothing.

Why is there a part of my CSS working and not the other??
Thank you!

[onemoretime]

Hi, @Helene_CHARBONNIER !!

At the moment, the values under Properties & Events are being displayed, but what about the CSS Classes section? Try registering a class named Card there, and then see what happens when you use the following code in the code panel.

.Card {
    box-shadow: 8px 8px 0px 0px black !important;
}

[Helene_CHARBONNIER]

Hi @onemoretime !
Thank you for your comment.

As mentioned in my post under the category “What I’ve tried so far”, second line, I already tried creating a CSS class that I named “.Card” and it didn’t do anything.

Same for all other elements I have been trying to customize.
Thank you though! If you find any other possible reasons please feel free to share it and I’ll try it out!

[Helene_CHARBONNIER]

Hi!
Still no clue what is happening? I still cannot use my CSS for new lines…
Another example with a very simple customization:

Even a simple border won’t show (yes, I tried to “run” the code and check if it shows up in the live version of the website and it doesn’t. And no using css class won’t change anything unfortunately).

With a css class instead:

Is this a bug??
Thank you.

[Rob]

I checked on a new site just to test since you mentioned that new lines of code weren’t working but I wasn’t able to replicate.

I tested with the same class you did and if I’m targeting the class, it seems to work (though for border-top, I did need to preview it to see it working).

I’m not super well-versed in using # to target the IDs but it seems using that might be different what is rendered but maybe this will help.

[Helene_CHARBONNIER]

Hi Rob!
Thank you for your answer.

I tried again with a very simple “background: lime;” on a basic container and it is working again! I don’t know what happened as I always have been using CSS class before even trying with the ID and I wasn’t able to see my code’s effect even in preview mode or after publishing the site and checking the live version.

I tried the initial multiple shadow I was stuck with before posting in the community and it worked.

Thank you again for your help and time. I read also that using the IDs in WIX’s CSS won’t work so I’ll make sure to always use a CSS class again.

[Rob]

I’ll ask but I’ve only used the classes along with attributes now so I’ll update with my findings if you can use IDs in some capacity.