Menu icon Foundation
Topbar transparency

I'm trying to use Topbar in a header with an image background. How do I set the background for the links, list items, and topbar to none? (Hover and backgrounds on the dropdowns can remain...)

(I did search, and found nothing that worked...)

Thanks!

topbartransparency

I'm trying to use Topbar in a header with an image background. How do I set the background for the links, list items, and topbar to none? (Hover and backgrounds on the dropdowns can remain...)

(I did search, and found nothing that worked...)

Thanks!

ayezee over 5 years ago

Try this
CSS
.top-bar.expanded .title-area, .contain-to-grid, .top-bar, .top-bar-section ul, .top-bar-section li:not(.has-form) a:not(.button), .top-bar-section .dropdown li a, .top-bar-section .dropdown li:not(.has-form) a:not(.button), .top-bar-section li:not(.has-form) a:not(.button):hover {
background:transparent;
}

Bill Sholar over 5 years ago

Thanks ayezee -- that got me 99% there and close enough to find the last 1% -- I had to add .top-bar-section ul li to your css to make it work for me, making it:

.top-bar.expanded .title-area, .contain-to-grid, .top-bar, .top-bar-section ul, .top-bar-section ul li, .top-bar-section li:not(.has-form) a:not(.button), .top-bar-section .dropdown li a, .top-bar-section .dropdown li:not(.has-form) a:not(.button), .top-bar-section li:not(.has-form) a:not(.button):hover {
background:transparent ;
}

Thanks again!