Sticky element

Hey sitadi,
The login to the live site is not working, but for the test site the search is sticky but seems to be in the wrong position when the header when it shrinks,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

#header.header-scrolled ~ #main #av_section_1 .avia_search_element {
top: -64px;
position: relative;
}
#header ~ #main #av_section_1 .avia_search_element {
top: -30px;
position: relative;
}

Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,

You can try this css code to adjust the display of the header on mobile view:

@media only screen and (max-width: 767px) {

  /* Add your Mobile Styles here */
  .responsive #header_main .container {
    height: 130px !important;
  }

  #top .avia_search_element.av-m8j6ucsp-f1ed25db4fcf2e1d4ba1dd7653626aed #s.av-input-field {
    line-height: 33px;
    height: 33px;
    color: #bed028;
    font-size: 14px;
  }

  #top #searchform_element {
    margin-bottom: 0;
  }

  #top .avia-section.av-m8h8o2m6-a6ff6f0926c56ce5cb244fa93948b320 {
    background-color: transparent;
    background-image: unset;
    margin-top: 5px;
    margin-bottom: 0px;
    position: absolute !important;
    margin-top: 0;
    z-index: 5000;
    margin-top: -40px;
  }

  #top .av-main-nav-wrap ul {
    margin: 0;
    padding: 0;
  }
}

View post on imgur.com

Best regards,
Ismael

Hi,

Thanks for the update. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard

Hi,

Could you provide a screenshot of the issue? We tried logging into the site, but the account details above are incorrect. Please provide another login account so we can check the live site.

Best regards,
Ismael

Hi,

Thank you for the update.

Instead of placing the search widget inside a Color Section, try inserting it directly into the header using a widget or widget area. Please refer to this documentation for more info.

— https://kriesi.at/documentation/enfold/header/#adding-a-header-widget-area

This is the html of the search element, which can be placed inside a Text widget: https://pastebin.com/K8x7qu9g

Best regards,
Ismael