Return to previous page

Trouble with logo overhang and sticky header; and FAQ

This topic has 8 replies, 3 voices, and was last updated 7 years, 5 months ago ago by Eva Kemp

pblasio

Participant

September 26, 2016 at 20:35

Trouble with logo overhang and sticky header; and FAQ

Header
Hi folks, we’re trying to wrap up our little site, but we’re having trouble with the header in both the default view and the scrolling slim or sticky header view.

Also, the FAQ
If you open and close a few FAQs you’ll notice that after a one or two closing a FAQ item, the copy stacks over the content in the block above it. What’s the story here? How do we fix this?

Wondering if you can help us?

Please, contact administrator
for this information.

#140806 Copied Theme version: 1.7 parent theme as child WooCommerce version: 2.6.4

7 Answers
Robert Hall

Support staff

September 27, 2016 at 07:27
Hello,

1) Sorry, but your query is unclear.
Please show a screenshot of the issue and what you want to achieve.

2) I’ve added this code in Global Custom CSS. Please check.
```
.ult_tabs .ult_tabcontent{
    height:auto !important;
}
```
Regards,
Robert Hall
#140823 Copied
pblasio

Participant

October 12, 2016 at 16:39

1. Sorry, I meant to provide that information. Please see links to the homepage default view that shows the header in its default state, and the header as a sticky header when the user scrolls down.

DEFAULT VIEW:
http://www.st48.com/demofbf/wp-content/uploads/2016/10/FBF-Homepage.jpg

FIXED/STICKY HEADER VIEW:
http://www.st48.com/demofbf/wp-content/uploads/2016/10/FBF-fixed-header.jpg

Please advise. Thank you. Theresa

#142475 Copied

Robert Hall

Support staff

October 12, 2016 at 16:45

Hello,

Sorry, but I can’t understand what exactly you want to fix there. Do you want the transparent background in default and fixed header?

Regards,
Robert Hall

#142477 Copied

pblasio

Participant

October 12, 2016 at 20:20

A few things going on there:

1. the header should be slightly transparent
2. The masthead image (farm) that is currently displaying under the header bar should be layered beneath the header.
2. the scalloped fluffy bottom farms logo should hang over….about the last 1/4 of the logo should sort of stick out a little.

You can see it better when you look at the sticky header example where we show the user has scrolled down the page.

LMK if you need more information. I really appreciate your assistance. T

#142501 Copied
Robert Hall

Support staff

October 12, 2016 at 20:46
Hello,

I’ve added the following code in 8theme Options->Styling->Custom CSS->Global Custom CSS. Please check.
```
.home .header-type-3 .header {
    background-color: rgba(255,255,255, 0.9);
    height: 110px;
}
.navbar {
    padding: 10px 0;
}
.home .header-type-3 .header .menu-wrapper {
    display: inline-block;
    padding-top: 20px;
}
.fixNav-enabled .fixed-active .header-wrapper {
    background-color: transparent;
}
```
Regards,
Robert Hall
#142502 Copied
pblasio

Participant

October 31, 2016 at 18:35

Yes! Thank you that solved the problem in the desktop view. In the mobile view – the logo looks like it gets stuck behind the masthead image. if you squeeze the page down to mobile view, you’ll see it right away.

Thank you and please advise. Thanks, Theresa

#144537 Copied
Eva Kemp

Support staff

October 31, 2016 at 18:46
Hello,

Please add this code in Custom CSS for mobile section:
```
.template-container .header-logo {
   z-index: 1;
}
```
Regards,
Eva Kemp.
#144540 Copied
Tagged: header, logo, overhang, sticky, template, woocommerce, wordpress
Viewing 8 results - 1 through 8 (of 8 total)