Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • February 2, 2018 at 12:47 am #906557
    catchbudapest

    Hi,

    this topic was already covered here and basically works also for me with the following code:

    #avia-menu #menu-item-2476 > a .avia-menu-text {
    border: 2px solid #FFFFFF;
    padding: 5px 10px;
    border-radius: 4px;
}

    2 more things I would like to add/ask:
    1. Is it possible to give the box a different color when the menu shrinks (by scrolling down)?
    2. Is it possible to have such a box in the mobile menu as well?

    BR

    February 2, 2018 at 3:08 am #906576
    John Torvik

    Hey catchbudapest,

    Please, share with us your website link and this way, we can check it better!

    Best regards,
    John Torvik

    February 3, 2018 at 5:48 pm #907253
    catchbudapest

    Hi John,

    Link in the private content.

    BR

    February 4, 2018 at 11:09 am #907430
    Victoria

    Hi catchbudapest,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
 .header-scrolled.header-scrolled-full #avia-menu #menu-item-4885>a .avia-menu-text {
    border: 2px solid #666;
    padding: 0 5px;
    border-radius: 4px;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    February 4, 2018 at 7:41 pm #907575
    catchbudapest

    Hi Victoria,

    thanks, that worked fine with Quick Css!

    But I just noticed that in the blog-post-view the menu item is not yet adressed.
    How can I adress the same menu item also there and add the box?

    For better understanding which view I mean here is alink where the box is still missing.
    ( the box shows up after scrolling down, but not yet at the very top)

    Thanks for your help!

    February 5, 2018 at 6:49 am #907762
    Victoria

    Hi catchbudapest,

    That’s because you have white background on that page and your border is white.

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
.single-post #avia-menu #menu-item-4885>a .avia-menu-text {
    border: 2px solid #666;
    padding: 0 5px;
    border-radius: 4px;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    February 5, 2018 at 11:22 am #907855
    catchbudapest

    Hi Victoria,

    perfect, thanks!

    Is it also possible to add such a box in the mobile menu?

    February 5, 2018 at 2:54 pm #908018
    Victoria

    Hi catchbudapest,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 767px) {
  .html_av-overlay-side #top #wrap_all #av-burger-menu-ul > li.menu-item-4885 a {
    border: 2px solid #666;
    padding: 5px 5px 0px 5px ;
    border-radius: 4px;
    width: 160px;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    February 5, 2018 at 6:01 pm #908119
    catchbudapest

    Hi Victoria,

    the code is not yet working perfectly.
    The text of the menu-item is left-aligned and not in-line with the the other menu items (see screenshot here).
    I played a bit with the width, but it didn’t make any difference for the element alignment.

    Is it possible to change that?

    BR

    • This reply was modified 6 years, 10 months ago by catchbudapest.
    February 6, 2018 at 11:08 am #908463
    Victoria

    Hi catchbudapest,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 767px) {
  .html_av-overlay-side #top #wrap_all #av-burger-menu-ul > li.menu-item-4885 a {
    border: 2px solid #666;
    padding: 5px 5px 0px 5px;
    border-radius: 4px;
    width: 160px;
    text-align: center;
  }
  .html_av-overlay-side #top #wrap_all #av-burger-menu-ul > li.menu-item-4885 {
    padding-left: 20px;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    February 6, 2018 at 12:59 pm #908542
    catchbudapest

    looks good, thanks a lot!

    February 6, 2018 at 8:11 pm #908767
    Basilis

    Hi,

    Glad we could help!
    Please take a moment to review our theme and show your support https://themeforest.net/downloads
    To know more about enfold features please check – http://kriesi.at/documentation/enfold/
    Thank you for using Enfold :)

    Best regards,
    Basilis

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Add a box around a specific menu item in top menu’ is closed to new replies.