Social Media Icons in navigation and transparent nav bar

cwly · Dec 14, 2020

Hi,

on my first page I have a full width slider where I added some CSS code in order to make the nav bar transparent:

#main-header {
background-color: transparent;
box-shadow: 0 0 0 rgba(0,0,0,.1);
}

However, when I scroll down the background of the nav bar comes back and everything is fine.

Now, I wanted to add some social media icons to my nav bar according to this article:
https://www.elegantthemes.com/blog/divi-resources/how-to-add-social-icons-to-divis-primary-menu

But it seems that the CSS code I added to get these icons doesn't work together with the code above.
After I added the following CSS code to the <head> section of the divi theme
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" />

my header is always transparent. Even when scrolling down. That is not how it is supposed to be.

Andy ideas?
Thanks

Divi.Help · Dec 16, 2020

cwly said: ↑

Hi,

on my first page I have a full width slider where I added some CSS code in order to make the nav bar transparent:

#main-header {
background-color: transparent;
box-shadow: 0 0 0 rgba(0,0,0,.1);
}

However, when I scroll down the background of the nav bar comes back and everything is fine.

Now, I wanted to add some social media icons to my nav bar according to this article:
https://www.elegantthemes.com/blog/divi-resources/how-to-add-social-icons-to-divis-primary-menu

But it seems that the CSS code I added to get these icons doesn't work together with the code above.
After I added the following CSS code to the <head> section of the divi theme
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" />

my header is always transparent. Even when scrolling down. That is not how it is supposed to be.

Andy ideas?
Thanks
Click to expand...

Kindly share your URL.

cwly · Dec 19, 2020

sorry for my late response.

I reverted all changes I have done so far because otherwise the header would be transparent and the links can't be read anymore.

But for sure you can have a look at: https://247racing.de/

Social Media Icons in navigation and transparent nav bar

cwly Member

Divi.Help Administrator
Staff Member

cwly Member

Useful Searches

Social Media Icons in navigation and transparent nav bar

cwly Member

Divi.Help Administrator Staff Member

cwly Member

Divi.Help Administrator
Staff Member