Okay
  Public Ticket #1163647
Resizing hero_bg on front page
Closed

Comments

  • sportbilly9323 started the conversation

    I would like to resize the full page sized header image section to take up only 60% of the vertical space on page load. How can I shrink down the top header section?

  •  42
    Joe replied

    Add the following custom css to either your theme settings page or your customizer page:

    .apex-hero {
      height: auto !important;
      min-height: 60% !important;
      display:-webkit-box;
      display:-ms-flexbox;
      display:flex;
      -webkit-box-orient:vertical;
      -webkit-box-direction:normal;
      -ms-flex-direction:column;
      flex-direction:column;
      -webkit-box-align:stretch;
      -ms-flex-align:stretch;
      align-items:stretch;
      -webkit-box-pack:stretch;
      -ms-flex-pack:stretch;
      justify-content:stretch;
    }
    #apex-hero-inner {
      flex: 1;
      display:-webkit-box;
      display:-ms-flexbox;
      display:flex;
      -webkit-box-orient:vertical;
      -webkit-box-direction:normal;
      -ms-flex-direction:column;
      flex-direction:column;
      -webkit-box-align:center;
      -ms-flex-align:center;
      align-items:center;
      -webkit-box-pack:center;
      -ms-flex-pack:center;
      justify-content:center;
    }
    
  • sportbilly9323 replied

    Thanks :)

  •  42
    Joe replied

    You're welcome!