elementor4fun-logo
Last update: October 1, 2018

Shrinking header

Step 1

Create your header and enabled the Sticky option.

Step 2

Change the scroll distance to anything but 0 :

Step 3

add your logo in the left row and your menu in the right row (not in the middle one).

IMPORTANT : add a Height to your logo :

And also a Height to the Header Row :

.oxy-header.oxy-sticky-header-active {
     background-color:rgba(215, 45, 70, 0.9);
}
 .oxy-header.oxy-sticky-header-active img {
     height:30px!important;
}
 .oxy-header img {
     -webkit-transition:0.5s ease all;
     transition:0.5s ease all 
}
 .oxy-header.oxy-sticky-header-active #_header_row-3-41 {
     height:50px 
}
 #_header_row-3-41 {
    -webkit-transition:0.5s ease all;
    transition:0.5s ease all
}

Replace "#_header_row-3-41" by your header row ID.

closealign-justifychevron-downcaret-up