Transparent background on dropdown menu

Site URL: https://cyan-oriole-hy6e.squarespace.com/

I have been trying to make the background on the dropdown menu transparent but can't seem to make anything work. I have tried this the following but the background is still there. Also trying to get a hover underline on the drop down links without making the «Table of Contents» title also have an underline. PLEASE any suggestions? 

I have tried the following for example. Does not work. 

.header-nav-folder-content {
  background: transparent;
}

1 hour ago, Lillayla said:

Site URL: https://cyan-oriole-hy6e.squarespace.com/

I have been trying to make the background on the dropdown menu transparent but can't seem to make anything work. I have tried this the following but the background is still there. Also trying to get a hover underline on the drop down links without making the «Table of Contents» title also have an underline. PLEASE any suggestions? 

I have tried the following for example. Does not work. 

.header-nav-folder-content {
  background: transparent;
}

Try adding to Home > Design > Custom Css

.header-nav-folder-content {
  background: transparent !important;
}
.header-nav-folder-title:after, .header-nav-folder-content .header-nav-folder-item a:after {
  content: '';
  display: block;
  width: 0;
  height: 1px;
  background: #fff; /*color of line*/
  position: absolute;
  transition: width 0.3s;
}
.header-nav-folder-content .header-nav-folder-item a {
  display:inline-block;
  position: relative;
}
.header-nav-item:hover .header-nav-folder-title:after, .header-nav-folder-content .header-nav-folder-item a:hover:after {
  width: 100%;
}

Let me know how it works on your site

Support me by pressing 👍 if this useful for you

My testing

I figured it out. Thank you 🙂

Hello, 

I tried using 
 

.header-nav-folder-content {
  background: transparent !important;
}

But it doesn't work. Maybe it has changed in 7.1 ? 

My website is : https://www.fcknyefestival.com

15 hours ago, Priscillia said:

Hello, 

I tried using 
 

.header-nav-folder-content {
  background: transparent !important;
}

But it doesn't work. Maybe it has changed in 7.1 ? 

My website is : https://www.fcknyefestival.com

Use this code

div.header-nav-folder-content {
    background-color: transparent !important;
}

On 12/13/2023 at 2:43 AM, tuanphan said:

Use this code

div.header-nav-folder-content {
    background-color: transparent !important;
}

 

Hello, 

Unfortunately this didn't work

16 hours ago, Priscillia said:

Hello, 

Unfortunately this didn't work

It doesn't work because you added the code to mobile query so it run on mobile only (red code).

You can move my code to top of CSS box

div.header-nav-folder-content {
    background-color: transparent !important;
}

6 hours ago, tuanphan said:

It doesn't work because you added the code to mobile query so it run on mobile only (red code).

You can move my code to top of CSS box

div.header-nav-folder-content {
    background-color: transparent !important;
}

 

Indeed thank you !!