Gap between menu and header elements

  • Hi Guys,

    First of all : Awesome theme !!!

    I have 3 questions :

    1-) I can’t figure out how to fix the gap between the menu and the header elements (cart, user, search icons). I tried all the menu/header/global layout settings, but wasn’t able to solve the issue.

    It seems that the only options that interacts with this issue is the: Header and topbar> Header layout and style> Header menu options> Spacing (px); I tried to put in the buttom field (-10px) but did not solve the issue.

    I’m having this issue with the 1st and 3rd menu layout, the second one is fine.

    https://ibb.co/NxyjHgj
    https://ibb.co/DCWc63N

    2-) I would like to know how to change the layout and add a header (that will include the page title and breadcrumbs) into the Shop, single product, my account, etc… pages.

    3-) Is it possible to display attributes in the shop/category pages?

    Thanks again.

Viewing 1 replies (of 1 total)

  • Hi there,
    about 1, that is correct, there’s a gap because the cointainer are not on the same line in that two layouts.

    You could try to change that with some custom css code

    @media only screen
and (min-width : 1024px) {
   /* layout 1 */
  .site-header.left_logo_navigation_below .header-contents {
display: grid;
grid-template-columns: 70% 30%;
  grid-template-rows: auto;
  grid-template-areas: 
    "header header"
    "main sidebar";
  
}
.site-header.left_logo_navigation_below .header-contents > .site-branding {
  grid-area: header;
}
.site-header.left_logo_navigation_below .header-contents > .main-navigation {
  grid-area: main
}

.site-header.left_logo_navigation_below .header-contents > .header-sidebar {
 grid-area: sidebar
}
 
  /* layout 3 */
.site-header.center_logo_navigation_below .header-contents {
display: grid;
grid-template-columns: 70% 30%;
  grid-template-rows: auto;
  grid-template-areas: 
    "header header"
    "main sidebar";
  
}
.site-header.center_logo_navigation_below .header-contents > .site-branding {
  grid-area: header;
}
.site-header.center_logo_navigation_below .header-contents > .main-navigation {
  grid-area: main
}

.site-header.center_logo_navigation_below .header-contents > .header-sidebar {
 grid-area: sidebar
}

}

    about 2, I am not sure what you want to accomplish as the theme just add a title with breadcrumb in that pages

    about 3, you can try to give a look to this free plugin https://www.ads-software.com/plugins/yith-color-and-label-variations-for-woocommerce/

Viewing 1 replies (of 1 total)
  • The topic ‘Gap between menu and header elements’ is closed to new replies.