Only stiky header

Public Ticket #21735

Conversation thread

KeviinP replied

4 years ago

Customer Reply

Hi,

Thank you very much, the problem is solved!

Regards,

Kévin

PenciDesign Supporter replied

4 years ago

Staff Reply

Hi,

About the spacing, please add this CSS to your site:

body {
  padding-top: 60px;
}

Regards,
PenciDesign.

KeviinP replied

4 years ago

Customer Reply

Thank you it works but I have one last problem, top of the page is hidden under the header.

How to add a margin to all the page?

The current css code for desktop and mobile :

.penci_topbar.penci-desktop-topbar, .penci_mobile_midbar.penci-mobile-midbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99999999;
}
.penci-builder-mobile-sidebar-nav.penci-menu-hbg, .close-mobile-menu-builder {
    z-index: 999999999;
}

Regards

Kévin

PenciDesign Supporter replied

4 years ago

Staff Reply

Hi,

Please edit your header with the Penci Header Builder, remove all the elements on Sticky Header tab, then add the following CSS to Appearance → Customize → Custom CSS:

.penci_header.penci-header-builder.main-builder-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99999999;
}

Regards,
PenciDesign.

KeviinP started the conversation

4 years ago

Conversation Start

Hello,

I don't need the normal header and the animation between the two header.

Is it possible to remove the normal header and just use the sticky header? I built the header with the header builder

Can i use class="penci-header-wrap" and class="sticky-wrapper" in header builder ?

I found this class here : https://soledad.pencidesign.net/soledad-travel-blog3/

Thank

Want to join this conversation or access attachments? Sign in first.