Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #559393

    Greetings,
    I have a site that’s got quite a bit of menu items. and it’s not very consistent. I’d like to add an ▼ or ▶︎ when there’s more Option below or beside so users would have an indicator when there’s menus. I found some CSS to make a block. but it’s not particularly good looking.

    #559412

    I found this
    .dropdown_available {
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3px 2.5px 0 2.5px;
    border-color: #D5D5D5 transparent transparent transparent !important;
    left: 0;
    right: 0;
    bottom: 3px;
    margin: 0 auto;
    }

    in another post and by doubling the numbers I got a good looking menu for top level nav.
    I guess I need to find a similar item for .dropdown_available but relating to the 3rd depth menu items. .rightpopout_available or something :-(

    #559696

    Hey!

    Send us a link to your page and we’ll take a look.

    Best regards,
    Elliott

    #560055

    I don’t really want my site on a public forum. I replied in private section. I saw an ERROR about blanck pages so I’m trying again. it’s a temperary URL anyway so won’t be valid for long.

    #560057

    Hey!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab to show arrow next to menu items with submenus

    .menu li > a:after { content: ' ▾'; } 
    .menu li > a:only-child:after { content: ''; }

    Please make sure that > sign is not converted to – http://i.imgur.com/IDXRZQ3.png in Quick CSS field.

    Regards,
    Yigit

    #560068

    thank you.
    although this is working on top and lower menus in the same manner. I’d like the Arrow to Point Down “toward the menu pop out” so on top level point down, and on Sub menu’s to point to the right.

    I’m not getting how CSS applies/evaluates conditions, the .dropdown_available {} seems to accomplish the first portion

    the Symbol, being beside on the top level significantly increases the the length and cause the menu to wrap.

    • This reply was modified 8 years, 10 months ago by rakoffron.
    #560475

    Hi!

    We need to see if the menu support this feature and add custom css classes accordingly. please provide me with your website login details in a private message.

    Regards,
    Vinay

    #560707

    A combination of
    .dropdown_available {
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 5px 0 5px;
    border-color: #0099CC transparent transparent transparent !important;
    left: 0;
    right: 0;
    bottom: 6px;
    margin: 0 auto;}

    And

    .sub-menu .menu-item-has-children > a:after {
    content: ‘\25BA’;
    float:right;
    color:#0099cc;}

    Seems to be doing a fairly good job, if there’s a reason to pursue, further I would be very happy for the help “like a better way to do this.
    Otherwise, thanks so much for helping

    #561220

    Hi!

    I see it’s working perfectly now. The css you have is the right way to do it. if there is anything else i can help you with please feel free to let us know.

    Cheers!
    Vinay

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