Viewing 19 posts - 1 through 19 (of 19 total)
  • Author
    Posts
  • #1204202

    Hi,
    i found this code snippet on the formus, but i’d like to have the burger menu on the right hand side of the icons.

    @media only screen and (max-width:479px) {
      .responsive #top #wrap_all #header_main .social_bookmarks {
        display: block !important;
      }
    
      .responsive #top .av-logo-container .avia-menu.av_menu_icon_beside {
        padding-right: 25px;
        margin-right: 25px;
        border-right-width: 1px;
        border-right-style: solid;
      }
    
      .responsive #top #wrap_all .main_menu {
        right: 0 !important;
      }
    }

    Could you please provide a snippet where the Bruger menu appears on the right hand side of the icons?
    Thanks in advance!

    #1204220

    Hey coeval,

    Please provide a link to the site/page in question so we can look into this issue further.

    Best regards,
    Jordan Shannon

    #1204395
    #1204477

    Hi,

    I’m not seeing any icons near the burger menu. Can you screenshot?

    Best regards,
    Jordan Shannon

    #1204561

    Burger Menu Screenshot

    #1204564

    Hi Coeval,

    Please add following code to Quick CSS

    .avia-menu.av_menu_icon_beside {
        float: right;
        padding-right: 0;
        margin-right: 0;
    }

    Best regards,
    Yigit

    #1205597

    Hi Yigit!

    i’ve the following code in my custom.css

    @media only screen and (max-width:720px) {
      .responsive #top #wrap_all #header_main .social_bookmarks {
        display: block !important;
      }
    
      .responsive #top .av-logo-container .avia-menu.av_menu_icon_beside {
        padding-right: 25px;
        margin-right: 25px;
        border-right-width: 1px;
        border-right-style: solid;
      }
    
      .responsive #top #wrap_all .main_menu {
        right: 0 !important;
      }
    }
    .avia-menu.av_menu_icon_beside {
        float: right;
        padding-right: 0;
        margin-right: 0;
    }
    Desktop Styles

    But it now looks like in the screenshot.
    Screenshot Mobile

    #1205685

    Hi,

    I cannot see the screenshot as it says it’s hotlinked :)

    Please try changing the code to following one

    @media only screen and (max-width:720px) {
      .responsive #top #wrap_all #header_main .social_bookmarks {
        display: block !important;
      }
    
      .responsive #top .av-logo-container .avia-menu.av_menu_icon_beside {
        padding-right: 25px;
        margin-right: 25px;
        border-right-width: 1px;
        border-right-style: solid;
      }
    
      .responsive #top #wrap_all .main_menu {
        right: 0 !important;
      }
    }
    .avia-menu.av_menu_icon_beside {
        float: right;
        padding-right: 0;
        margin-right: 0;
    }
    /* Desktop Styles */ 
    

    If that does not fix it, please post a screenshot using imgur.com or Dropbox public folder. You can check your CSS for errors using this website – http://csslint.net/

    Best regards,
    Yigit

    #1205974

    Hi Yigit!
    undortunately that doesn’t help.

    Here is a screenshot uploaded to imgur:

    View post on imgur.com

    • This reply was modified 4 years, 7 months ago by coeval.
    #1206027

    Hi,

    Did you add the code to the very top of quick css so it runs first? Also, clear the cache a few times over.

    Best regards,
    Jordan Shannon

    #1206393

    Hi Jordan,
    I just checked. It makes no difference, if I use custom css or quick css.

    #1206462

    Hi,

    Could you please create temporary admin logins and post them here privately so we can look into it? There might be an error in your custom CSS code.

    Best regards,
    Yigit

    #1206687
    This reply has been marked as private.
    #1206781

    Hi,

    Please change following code in custom.css file

    @media only screen and (max-width: 720px) {
    .responsive #top #wrap_all #header_main .social_bookmarks {
        display: block !important;
    }}

    To following one

    @media only screen and (max-width: 720px) {
    .responsive #top #wrap_all #header_main .main_menu .social_bookmarks {
        display: block !important;
    }}

    Please make sure to flush cache as well. If that does not help, please share WP admin logins please.

    Best regards,
    Yigit

    #1206993

    Hi,
    it looks better but now i still have the menu icon on the left. I’d like to have it on the right:

    View post on imgur.com

    #1207460

    Hi,

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

    CSS Snippet:

    
    .responsive #top .av-logo-container .avia-menu.av_menu_icon_beside {
        float: right;
        margin-right: 0;
        padding-right: 0;
    }
    
    

    Best regards,
    Yigit

    #1223157

    Thanks. It looks better now, but the separator is on the wrong side.

    #1223160
    #1223359

    Hi,

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 480px) {
    .responsive #top .av-logo-container .avia-menu.av_menu_icon_beside {
        border-right: none;
        border-left: 1px solid currentColor;
    }}

    If you would like to remove it, you can simply use

    .responsive #top .av-logo-container .avia-menu.av_menu_icon_beside {
        border: none; 
    }

    Best regards,
    Yigit

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