decrease space between row and menu

  • Resolved eholz1

    (@eholz1)


    7 years, 5 months ago

    I am using the activation theme, a child of Primer theme.
    I have modified the css to allow display of my full image in header:
    .page-title-container {
    height: 400px;
    }

    That allows display of the image. But my problem now is that the amount of space below the navigation menu and the text is way too much. Is there anyway to reduce the amount of space so the rows containing the lead-in text are closer? Yes, if I remove the css above, the rows move up on the page, but the image is almost completely hidden.

    Any ideas on this?
    Thanks for previous help.

    Eholz1

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)

  • Hi @eholz,

    I would suggest adding the height to the .site-header-wrapper element instead of the .page-title-container.

    I’m not sure why there is such a large gap when added to the latter item, but adding it to the former (.site-header-wrapper) appears to resolve the issue.

    Let me know if (when you switch .page-title-container to .site-header-wrapper) you are seeing similar results as me.

    Pro Tip: You can also set the header to 100% of the view port height, minus the height of the menu bar – so the menu bar is visible on initial page load.

    .site-header-wrapper {
   height: calc( 100vh - 81px );
}

    Evan

    • This reply was modified 7 years, 5 months ago by Evan Herman.
    • This reply was modified 7 years, 5 months ago by Evan Herman.
    Thread Starter eholz1

    (@eholz1)

    Hello Evan,

    Thank you very much for the tips on this. I really appreciate the
    information, I added extra height to the .site-header-wrapper and that
    resolved the issue. Thanks so much, also the pro tip is very helpful for
    future thought.

    Thanks Again,

    Eric aka ewholz

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘decrease space between row and menu’ is closed to new replies.