[Support request] How can i add designed menu like this and sub menu text hover border

Home Forums Support [Support request] How can i add designed menu like this and sub menu text hover border

Home Forums Support How can i add designed menu like this and sub menu text hover border

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #620993
    Jai Hari Shankar

    https://www.premierleague.com/ you can check the exact link.How can i add exact type of menu design and sub menu text hover border.

    I have tried to make my website like that https://stockwizaards.com

    code i used is below


    @media
    (min-width:769px) {
    .secondary-navigation .main-nav ul li.nav-button a {
    background-color: #00337f;
    border: 2px solid #ffffff;
    border-radius: 8px;
    color: #ffffff;
    }

    .secondary-navigation{
    border-bottom: 2px solid #d3d3d3;
    }
    .secondary-navigation li:hover {
    border-bottom: 2px solid #000000;
    }
    .secondary-navigation {
    margin-bottom: 5px;
    }
    }

    is the code right til now ??

    #621285
    Leo
    Staff
    Customer Support

    Hi there,

    Are you talking about the mega menu (columns) and the bottom border or just the border?

    If you are talking about the mega menu as well then you might need to check out a plugin for that as the style of our mega menu is different: https://docs.generatepress.com/article/building-simple-mega-menu/

    Let me know.

    #621581
    Jai Hari Shankar

    Leo,thanks for your reply.Am not talking about mega menu.Kindly click on the premier league link i provided and look at there primary menu.Its in designed shape.I want like that.And when you click on any link in that menu,you will see pink background in sub menu and text gets underlined when hovered.So i want to make mine like that.

    #621686
    Leo
    Staff
    Customer Support

    I did check out the link.

    What do you mean by “designed shape”? Like it’s in two columns?

    Try this CSS for the hover border:

    .main-navigation .main-nav ul ul li a:hover {
        border-bottom: 1px solid #000;
    }
    #621695
    Jai Hari Shankar

    Leo that code is giving border below entire row of text -i want just below the text a line to come not at separation.Why don’t you refer the site which i provided.

    #621852
    David
    Staff
    Customer Support

    This has been covered here.
    https://generatepress.com/forums/topic/primary-navigation-menu-going-outside-its-background-image/

    Please could you try to keep related support requests within one Topic. It makes it easier for us to answer your requirements. Thank you.

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