Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    Posts
  • #461670

    When scrolling, there is a point where the logo and menu fall below the bottom edge of the header. You can see it in the image here:
    http://screencast.com/t/K8laBVXF

    We’re looking good when scrolling further down and when at the top. it’s just occurring in one point of the scroll.

    Thoughts on how to resolve?

    Many thanks.

    #462011

    Hey Greg!

    Please remove following codes from your custom CSS

    #top .main_menu .menu {
      position: relative;
      top: 120px;
    }
    #top .main_menu .menu > li > a {
      height: 50px !important;
      line-height: 50px !important;
    }

    Then post a screenshot and show the changes you would like to make

    Cheers!
    Yigit

    #462039

    Hi Yigit,

    I removed the CSS. Disregarding the font Here is what we are looking to accomplish:

    A) We’re looking to move the menu and logo closer to the multi-colored line. (disregarding the font difference, please refer to the first screenshot below for an example of the spacing).

    http://screencast.com/t/0MOfmH9vI

    B) Also, the sub menu should reside just below the main menu. You can see the current large gap in #2 in the second screenshot below.

    C) Lastly, as we scroll, the logo (the menu is fine now with the removal of the CSS but if we move it down it may also have this issue) falls down below the bottom of the header (multi-colored line). See #1 in the screenshot below.

    http://screencast.com/t/G22FEtA6FIPI

    Many thanks for your help.

    #462517

    Hey!

    A) Control the position of your menu with this code:

    nav.main_menu {
    top: 46px;
    }
    

    B) Use this to control position of sub menu:

    ul.children {
    top: 117px;
    }
    

    C) Would be quite difficult to control the changing of logo shrinking as it is hard coded, but I suggest to use a png24 image file with transparent background, instead of a jpg image with white background.

    Hope this helps.

    Cheers!
    Andy

    #467310

    Great. Thank you. Sorry too for the slow response.

    Here’s what I used:

    nav.main_menu {
    top: 46px;
    }
    ul.children {
    top: 117px;
    }

    And when the heading shrinks when scrolling:

    .header-scrolled nav.main_menu {
    top: 46px;
    }
    .header-scrolled ul.children {
    top: 117px;
    }
    #468762

    Hi!

    alright, thanks for sharing. Let us know, if you have some more questions or issues related to the theme. We are happy to assist you.

    Regards,
    Andy

    #754973

    Hi,

    I have logo set to centre and menu below. What i need to achieve is to change the position when scroll/sticky header to:

    menu = left
    logo= right

    Can this be done?

    Thanks in advance

    #755065

    Hi,

    That may not be possible or might take a lot of time but would you mind providing a precise link to your site, showing the elements in question? We need to be able to inspect them in order to let you know if that’s possible.

    Best regards,
    Vinay

    #755097

    It’s http://www.cyprusaware.eu

    • This reply was modified 7 years, 8 months ago by mike.rav.
    #757745

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    @media only screen and (max-width:767px) {
    #advanced_menu_toggle, #advanced_menu_hide {
        left: 0;
        right:auto!important;
    }
    .responsive #top .logo {
        float: right!important;
    }}
    

    Best regards,
    Vinay

    #758224

    Hi,

    I added the css you provided but nothing changed. Please note that we would like this change to be done to desktop version and not responsive view.

    Thanks

    #760644

    Hi,

    then try Vinay’s code without media queries:

    #advanced_menu_toggle, #advanced_menu_hide {
        left: 0;
        right:auto!important;
    }
    .responsive #top .logo {
        float: right!important;
    } 

    Best regards,
    Andy

    #760686

    Hi,

    I added it. Still nothing happens.

    Thanks

    #763190

    Hi,

    I’m not sure why it’s not working for you. But when we test the code in the editor it does affects the menu and the logo position in the mobile view.

    It may not be working for you because of caching issue. Please try to hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload” and review the site again.

    Disable any caching plugins if they are active to preview changes.

    Best regards,
    Vinay

    #763526

    Hi,

    Please note that i do not want to do any changes in responsive mode. What i am saying in my initial description is the following:

    I have logo set to centre and menu below. What i need to achieve is to change the position when

      scroll/sticky header

    to:

    menu = left
    logo= right

    Can this be done?

    Thanks

    • This reply was modified 7 years, 7 months ago by mike.rav.
    #764334

    Hi george,

    Try this adjustment. Notice though, the menu does not become the burger menu since it’s normal screen mode.

    
    .responsive #top .header-scrolled.header-scrolled-full .main_menu {
        text-align: left;
    }
    .responsive #top .header-scrolled.header-scrolled-full .logo {
            left: 90%;
    } 
    

    Is this what you’re trying to achieve?
    Best regards,
    Victoria

    • This reply was modified 7 years, 7 months ago by Victoria.
    #764653

    Hi,

    I tried the styles you provided. Logo goes on the right side correctly when the header is sticky. The menu also goes left but i would like it in the same row as the logo. Currently it is just moved on the left side in the same row it was before.

    Thanks

    #766164

    Hi,

    it’s not clear to me what you want to achieve. Can you provide us a screenshot/mockup showing the results you want to achieve please? use imgur.com or dropbox.

    Best regards,
    Andy

    #766188

    I am providing one screenshot of how it looks on sticky header now:
    https://www.dropbox.com/s/m9qibza04jm65c3/current_version.jpg?dl=0

    and one screenshot of how we want it to look:
    https://www.dropbox.com/s/7s03lmcs8mqv14j/required_version.jpg?dl=0

    Thanks

    #767344

    Hi,

    Please post us your login credentials (in the “private data” field), so we can take a look at your backend.

    Login credentials include:

    • The URL to the login screen.
    • A valid username (with full administration capabilities).
    • As well as a password for that username.
    • permission to deactivate plugins if necessary.

    Best regards,
    Andy

Viewing 20 posts - 1 through 20 (of 20 total)
  • You must be logged in to reply to this topic.