Transparent header with visible Logo, Social Icons, Contact and Menu.

[Hegel]

Hi,

I have performed a thorough search but cannot find a solution to this problem.

I want logo, social icons, menu and contact email to appear over a Revolution Slider video. As shown in the attached image, I cannot remove the white bar at top of header.

[Hegel]

Sorry, here’s the image attachment.

Attachments:

You must be logged in to view attached files.

[Hegel]

Apparently I now have two white areas – don’t know how that happened. See attached image. I need to remove both of them.

Attachments:

You must be logged in to view attached files.

[sharmstr]

Hard to know for sure without seeing the code, but my guess (based on experience) is that you have a top padding or margin set in the row settings for your first row.

There is no setting in Kleo that will allow you to add an email address to the top bar. You can add a custom link to the top menu and set the title to your email address, but obviously that wont launch your email client. It will merely just display your email address.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[Hegel]

Ah, thank you very much. I needed someone to point me in the right direction and now I’ve removed that white area. Would you know how to make the Social Icon background transparent?

[sharmstr]

.header-color.social-header {
background-color: transparent !important;
}

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[Hegel]

That’s great – thanks a lot.
One further question – is it possible to remove the white borders that have now appeared. Please see below.

Attachments:

You must be logged in to view attached files.

[sharmstr]

add border:0;

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[Hegel]

Hi, thanks you for all your support so far but there are still some unwanted lines. Please see attached image.

Attachments:

You must be logged in to view attached files.

[sharmstr]

Sorry – try this

COPY CODE

#top-social li a {
    border-right: none !important;
}

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[Author]

Posts