Tagged: , ,

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • December 29, 2014 at 8:29 pm #372790
    garycedar

    Hi,

    I am having an issue with the Header Secondary Menu when displaying on Responsive Screens.

    When the Enfold theme is displayed Full Width, both the Main Menu and Secondary Menu are on “One Row” which is what I want.

    But when viewed on a responsive display @media (max-width: 767px) the Secondary Menu has the following layout issues:

    1. creates a “second header row” below the Main Menu
    2. the secondary menu text becomes “centered”
    3. overlays the header Logo

    My goal is to have the Responsive Header look exactly like the Full Width Header, with the Social Icons on the right, and the WooCommerce Cart links on the left.

    Does anyone have a CSS fix I can add to make this happen?

    Many thanks!

    December 29, 2014 at 9:21 pm #372813
    Elliott

    Hey garycedar!

    Add this to your custom CSS.

    @media only screen and (max-width: 767px) {
.responsive #header .sub_menu, .responsive #header_meta .sub_menu > ul { position: absolute !important; top: 1px !important; right: 0px !important; }
}

    Regards,
    Elliott

    December 30, 2014 at 8:38 pm #373275
    garycedar
    This reply has been marked as private.
  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Header Secondary Menu CSS – Responsive Issue | Creates "2 Offset Header Rows"’ is closed to new replies.