CSS is not reflecting

Development

AI-generated summary

The user Aditya_Shevle reported that their CSS changes were not reflecting despite saving them. keegan explained that the CSS should be placed in the CSS tab rather than the <head> section, as the CSS tab has higher priority. tynaut elaborated that styles in the <head> have lower priority and can be overridden by those in the CSS tab, and also advised checking if the theme is enabled and properly selected in the theme-component settings. Aditya_Shevle confirmed that the issue was resolved after applying the suggested changes.

1

Hi,

I have added a css which is not reflecting even though I’ve saved it. Can someone help me with this? Please go through the attached screenshot.

Thank you in advance!

Screenshot 2023-12-09 at 12.07.35 AM
Screenshot 2023-12-09 at 12.07.35 AM2210×1050 168 KB

2

Instead of putting this in the <head> tag section wrapped in a <style> tag, you should put it in the CSS tab like so:

Screenshot 2023-12-08 at 10.45.29
Screenshot 2023-12-08 at 10.45.291092×288 16.4 KB

Screenshot 2023-12-08 at 10.45.41
Screenshot 2023-12-08 at 10.45.411108×140 10 KB

3

  • Elaborating on this:

    Styles in the <head> tag section can apply, but they have lower priority. If you have styles in the <head> tag section and styles in the style section, the style section will take priority and override your changes, as the head tag is loaded earlier. Later is considered more !important.

  • Another thing to check for is:

    • If this is a theme, make sure the theme is checked as Enabled.

    • If this is a theme-component, make sure under the theme-component settings “Include component on these themes” has your active theme selected.

4

@tynaut Thank you so much for the help. It perfectly working.