[Resolved] Ajax Menu Gap missing

Home Forums Support Ajax Menu Gap missing

  • This topic has 3 replies, 2 voices, and was last updated 5 months ago by Elvin.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1466407
    troyw

    Hey team,
    With reference to response ID #1446545.
    When I implemented this CSS it worked fine;

    #primary-menu > #menu-menu > li:nth-child(6) {
    margin-left: 150px;
    }

    However, since then I have changed Layout > Header setting to ‘Use Navigation as Header’, because without this ticked, the menu was not working responsively very well. (As the page width was reduced, the menu fell to bits).
    Now I have selected ‘Use Navigation as Header’ though, the responsiveness is perfect, but I have lost the Gap in the menu menu. I have tried adjusting the margin-left pixels but nothing I do gives me that gap I need.

    All I need is that gap in the menu between the Phone Number and ‘My Account’

    Any ideas?
    Thanks

    #1466413
    Elvin
    Staff
    Customer Support

    You can try this CSS code:

    @media (min-width:1024px){
    .main-nav ul li:nth-child(7) {
        margin-left: 150px;
    }
    }
    @media (max-width:768px){
    .main-nav ul li:nth-child(7) {
        margin-left: auto;
    }
    }
    

    Media rule was added so it doesn’t break the alignment in mobile view.

    A wise man once said:
    "Have you cleared your cache?"

    #1466439
    troyw

    Perfect, Thanks Elvin.

    #1466464
    Elvin
    Staff
    Customer Support

    No problem.:)

    A wise man once said:
    "Have you cleared your cache?"

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