Custom CSS doesn't seem to work at all? Can someone provide simple code of any kind to test this?

Site URL: https://www.qbpsychology.ca/

Hi all, I had posted before requesting css code to make only the header on the home page transparent. Another user sent me some code, and at first it looked like it worked, but then it just didn't.... everything was back to normal. I've tried restarting, closing the program, multiple other examples of css... nothing is working. I also tried following a tutorial online for getting a parallax effect in the header and that didn't work. I went back and checked what i did four times. I cannot see an error when compared to what was shown online, and that used the data section id for my specific website so it seems like it should have worked...

At this point im not sure that the css works at all. i don't care what code you send me, just make it something that will be obvious if it works, like changing the header font color or something. I've tried other code ive found on here but i'm left wondering if maybe that code is somehow specific to the url it was designed for? (i don't think so, but i'm all out of ideas).

Thank you!!!

We can't see the site but if you want a  bit of custom css test code, try this. It gives all image blocks a drop shadow, not index thumbnails but images in a blog post for example.

.image-block {
  filter: drop-shadow(8px 8px 8px #666666);
}

Interesting! that did work! Ok, then it must be something about the code I was using. Do you know how to make it so the header is transparent on only the home page and not on any of the other pages?

Try this in custom css:

.homepage .header-announcement-bar-wrapper {
    background: rgba(0,0,0,0) !important;
}

Hi, that didn't seem to work but the most unusual thing has happened. it seems like putting in the first code you sent me "woke up" the css editor, because now the code that i wrote yesterday to get the parallax effect is working?!

I'm wondering if having both sets of code in here is a problem, although the code as i have it written only applies to the main page. 

Here's what I've currently got in my css. the blue text is the code i've written based off of a you tube video. the code you sent me is below. is there anything about this that explains why your code isn't having an effect? Thank you very much for your time on this, it's greatly appreciated 🙂

//adding parallax
[data-section-id="5fd3c136f185343d3286a5ac"]{
  .section-background{
    &::after {
    //creating the element      
      content: "";
      width:100%;
      height:100%;
      position: absolute;
      
      //adding the image
      background-image:url(https://static1.squarespace.com/static/5fd27dadddcfa0625ddecf41/t/5fe3a0881140f62682ba512a/1608753292586/wheat+shadow.jpg?format=1500w);
      background-repeat:no-repeat;
      
      //positioning the image
      background-size:cover;
      background-position:center center;
      background-attachment: fixed;
      transform: scale(1.2);  
      
      //mobile
      @media(max-width:787px){
        background-position:center center;
        background-attachment: scroll !important;
      }
    } 
  }
}

.homepage .header-announcement-bar-wrapper {
    background: rgba(0,0,0,0) !important;
}

If both sets of code are working all should be fine. A lot of code is template based, won't work someplace else. That is not unusual. Good thing is if it doesn't work or worse yet makes something quit working all you have to do is delete the code. My site has a lot of code , scattered all over the place, and I have broken a page or two this Christimas with some of my experimenting. See some of at work if you wish:

my random views

that's the thing, the code you just sent wasn't working. the first code you sent did (to make the shadow) and weirdly, after deleting that and pasting in the code i'd written before, the code i wrote did work (it hadn't worked at all before so there's really no good explanation for that).

I tried adding the code you just sent for the transparency to the end of what i did, but your code didn't work. i just now tried deleting my code above it in case that was getting in the way, but it still isn't working. Do you have any ideas?

I was referring to your first code. If it works with the drop shadow code I sent, that is okay. I don't think the second code I sent and your first one should be posted in css at the same time, they most likely conflict with each other. That is one of my personal rules about using custome css. Never post two code solutions at the same time when trying to make the same thing happen with each snippet, something is either not going to work or mess something up. I forgot my own rule when I posted two differetnt code snippets to make for snow fall,  on my site in custom css, and it blanked out four pages, there was snow but nothing else. .