This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Vantage Theme: Main Menu left-aligned collapsing in Safari

Resolved 11 replies generalpremium
TJCLearning
10 years ago · Last reply by Magus 10 years ago

Lately, I had the same issues with Firefox and Chrome, so with your help, I added custom CSS:
/* Main Menu With Across Browsers */

body.has-menu-search .main-navigation ul {
margin-right: 44px !important;
}

But, the menu doesn't appear in one line as other browsers. What can I do?

Thanks for your help!!!

ps. can't select Theme from the drop down below. I'm using Vantage.

URL: http://www.inlogic.ca

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

11
  1. Magus Staff 10 years, 9 months ago

    Hi TJCLearning

    I am not seeing any differences between any browser. Would it be possible for you to upload a screenshot to your site and link to that.

    Thanks

    Magus

  2. TJCLearning 10 years, 9 months ago

    Hi Magus,

    Here’s the screenshot.
    http://www.inlogic.ca/images/safari_view.png

    Thanks :)

  3. Magus Staff 10 years, 9 months ago

    Hi TJCLearning

    Please try the following in your custom CSS

    .main-navigation ul li a {
    padding: 20px 33px !important;
}

    I can only see this issue in safari which handles fonts differently than other browsers, which is why you are seeing this problem. the above should help without making too much of an impact on the way other browsers render the content.

    Magus

  4. TJCLearning 10 years, 9 months ago

    Sorry Magus, but it didn’t solve the problem….

  5. Magus Staff 10 years, 9 months ago

    Hi TJCLearning

    The problem looks resolved on my end, displaying the same in all browsers including Safari.

    It might be the browser cache. Try clearing your browser cache, and then refreshing the page to see if that helps.

    Magus

  6. TJCLearning 10 years, 9 months ago

    nope…after resetting safari, tried, but remains the same.
    should i delete the previous CSS?

  7. Magus Staff 10 years, 9 months ago

    Hi TJCLearning

    Leave the original CSS and change the second figure ’33px’ down 1 at a time until you get the desired result.

    Magus

  8. TJCLearning 10 years, 9 months ago

    Yup, it worked at 32. Ha!
    Thanks a lot!!

    Just wondering…currently I have 2 CSS’ as you guys suggested, both for the same issue in different browsers:

    .main-navigation ul li a {
    padding: 20px 33px !important;
    }

    body.has-menu-search .main-navigation ul {
    margin-right: 44px !important;
    }

    Do i really need them both?

  9. Magus Staff 10 years, 9 months ago

    Hi TJCLearning

    yes, you should keep both options. they both target different aspects of the menu. The one I just provided targets the area around the menu text and the original one targets the menu alignment on the page.

    Magus

  10. TJCLearning 10 years, 9 months ago

    thanks for the kind explanations and great help!!!

  11. Magus Staff 10 years, 8 months ago

    Hi TJCLearning

    You are welcome. If you need any more help please feel free to open a new support thread.

    Magus

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread