[Resolved] Main navigation page header merge padding problem

[Frank]

Hi people of GP,

Sorry im bothering you with this but im really stuck on this issue.

My woocommerce shop page uses an advanced search widget. I want to have it inline with the primary navigation.
So first i had a shortcode for the widget in the top-bar. That didnt really work, so now i have it set in a shop specific page-header.
Its getting close but the page header has some top-padding i cant seem to get rid of. Once i merge it and place the content behind it gives the effect i want (inline primary navigation). But the widget and page header still have the extra padding making it stick out at the bottom.

I tried everything and threw all my css skills i learned so far at it, but cant seem to figure it out :(…

Could you help me out?

Cheers,
Rob

[Frank]

Got some support from facebook, finally got it figured out.

div#aws_widget-19 {
margin-top: -16px;
position: absolute;
z-index: 1000;
display: inline-block;
}

Any ideas on making the widget stick with the sticky navigation?
If thats too difficult, im already quite happy with this :).

Cheers

[Leo]

Hi there,

In order to be in the sticky navigation, you would need to use this hook:
https://docs.generatepress.com/article/generate_inside_navigation/

Let me know if this helps.

[Frank]

I changed the position from ‘absolute’ to fixed, that seems to have done the job.

[Leo]

Glad you found a solution 🙂

[Author]

Posts