Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • June 25, 2022 at 3:44 pm #1356481
    MLA18

    I have implemented the “Dots Menu” based on the following documentation: https://kriesi.at/documentation/enfold/menu/#dots-menu

    My question is: how do I get the Menu-Titles to display on the Dots Menu? For example, the first Dot would say “Item One” directly to the right of the dot in the first position of the menu.

    I have been experimenting with changing visibility settings as per the CSS that comes along with the documentation, but have so far had no luck.

    Any feedback you could provide would be greatly appreciated.

    Thanks in advance!

    June 26, 2022 at 8:06 pm #1356545
    Mike

    Hey MLA18,
    Thanks for the link to the documentation you are trying, but I couldn’t login to see your page, nonetheless I created a test page and was able to adjust the css to show the menu item text to the left of the dots:
    2022-06-26_005.jpg
    change this css:

    #top .dots-menu .av-subnav-menu li a .avia-menu-text { 
visibility: hidden;
}
#top .dots-menu .av-subnav-menu li a {
  border: 1px solid grey;
  max-width: 25px;
  max-height:25px;
  border-radius:25px;  
  overflow:hidden;
  padding: 0 !important;
  border: none!important;
  background: #f3f4f7;
}

    to this:

    #top .dots-menu .av-subnav-menu li a .avia-menu-text { 
    left: -50px;
    position: relative;
    color: #fff;
}
#top .dots-menu .av-subnav-menu li a {
  border: 1px solid grey;
  max-width: 25px;
  max-height:25px;
  border-radius:25px;  
  overflow:visible;
  padding: 0 !important;
  border: none!important;
  background: #f3f4f7;
}

    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

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