Issue with the menu appearance on Edge & IE

My menu wasn’t looking fine on chrome so we added some CSS however, that made it look bad in Edge and IE. Can you help?

  • Dimitris
    • Support Star

    Hello there Dominic

    I can see a CSS rule that mess with the menu position in Salient -> General Settings -> CSS/Script Related -> Custom CSS Code:

    @media only screen and (min-width: 1001px) and (max-width: 1476px) {
    #header-outer .row .col.span_9 {
    float: right!important;
    position: absolute!important;
    right: 0!important;
    transition: none!important;
    margin-top: 70px;
    margin-right: 0%!important;

    Could you please replace in above rule the

    margin-top: 70px; with

    margin-top: 20px;

    Also remove all CSS rules added during the live chat session in Appearance -> Customize -> Additional CSS and let me know how that goes.

    Thank you,


  • Kris
    • Support

    Hi Karina

    I made update in css fix and I clear cache. I also check in all browser and menu is now in correct position.

    Please double check on your side (before that please clear fully your browser cache).

    This is current code I added:

    /*fix chrome*/
    @media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm) {
    nav ul.sf-menu.sf-js-enabled.sf-arrows:nth-child(2) {
    top:-50px !important;}

    /*fix firefox*/
    @-moz-document url-prefix() {
    nav ul.sf-menu.sf-js-enabled.sf-arrows:nth-child(2) {
    top:0 !important;}

    @supports (-ms-ime-align:auto) {
    nav ul.sf-menu.sf-js-enabled.sf-arrows:nth-child(2) {
    top:0 !important;}

    Kind Regards,


  • Karina
    • New Recruit

    Hi Kris

    it didnt solve the issue. The menu appears normally only when you are logged in WordPress, once you are logged in as a customer – the menu is the same, broken.

    Could you please look into it again?

    Thank you


Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.