Docs

[Freshnous]

Hi- wondered if you might be able to help with making the top bar transparent on http://www.threepearstreecare.freshnous.com

I have already entered the following code:

.x-logobar, .x-navbar,.x-topbar {
background-color: rgba(0,0,0,0.5);

but the topbar is still not transparent. Any help would be much appreciated.

[Rupok]

Hi there,

Thanks for writing in! There is nothing behind the Topbar so the transparency is not visible.
You can add this under Custom > CSS in the Customizer.

.masthead.masthead-stacked {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	z-index: 99;
}

Hope this helps.

[Freshnous]

Thanks for the reply-this has worked but I would like the top bar and the nav bar to have no bottom border line. Any further ideas would be much appreciated.

Many thanks

[Rahul]

Hey There,

Thanks for writing back!

We’re unable to replicate the issue. Would you mind providing us with a Screenshot of it so that we can take a closer look of it? This way we can provide you a tailored answer to this query.

Thanks for understanding!

[Freshnous]

Hi-thanks for the reply

I have attached a screenshot to help.

Many thanks

[Freshnous]

The attachment file was too big- the live site should show the problem now:

http://threepearstreecare.freshnous.com/

[Joao]

Hi There,

Please add the following code to Apperence Customizer Custom CSS

.x-logobar, .x-navbar, .x-topbar {
    border: 0 !important;
}

Let us know if you need further assistance.

Thanks

Joao

[Freshnous]

Thanks for your excellent support- this has worked brilliantly.

Two additional problems I have:

1. On small tablet view and mobile view, the the topbar/navbar/logobar are not transparent- instead there is a grey background.

2. The background colour of the dropdown menu is currently white and I would like to change it to grey as because the text is set to white, it doesn’t show unless hovered.

Thanks so much for your help

[Jade]

Hi there,

Please add this code as well:

.masthead-stacked .x-navbar .desktop .sub-menu {
    background-color: #ccc;
}

.x-topbar .p-info {
    background-color: transparent;
}

Hope this helps.

[Freshnous]

Thanks a lot- this has worked brilliantly. Your support is excellent.

[Prasant Rai]

You are most welcome. 🙂

[Author]

Posts