Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Multi level dropdown menu disappear after clicking sub menu

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #254279

    Its very irritating as after hovering over main menu > sub-menu and clicking onto sub menu page, page gets open but sub menu disappear but still functioning when hover.

    ul.dropdown-menu {
        background-color: #fff;
        border-radius: 0;
        color: #686664;
    }
    #top-section #peace-menu .nav > li > ul.dropdown-menu {
        border-top: 4px solid #F1C152;
    }
    #top-section #peace-menu .nav > li > ul.dropdown-menu {
        padding: 0px;
        background: #FFFFFF;
    }
    #top-section #peace-menu .nav > li > ul.dropdown-menu:after {
        content: '';
        position: absolute;
        border-style: solid;
        border-width: 0 10px 10px;
        border-color: #F1C152 transparent;
        display: block;
        width: 0;
        z-index: 1;
        top: -10px;
        left: 28px;
    }
    .dropdown-menu > li {
        padding: 0px 0px;
        border-bottom: 1px solid #e9e5e5;
    }
    .dropdown-menu > li:last-child {
        border-bottom: none;
    }
    .dropdown-menu li a {
        color: #fff;
    }
    .dropdown-menu>li>a:focus,
    .dropdown-menu>li>a:hover {
        color: #FFFFFF;
        text-decoration: none;
        background-color: #180e0e;
    }
    .nav .open>a,
    .nav .open>a:focus,
    .nav .open>a:hover {
        background-color: transparent;
        border-color: transparent;
    }
    .dropdown-header,
    .dropdown-menu>li>a {
        white-space: nowrap;
        padding: 0px 15px;
        line-height: 1.42857143;
        font-size: 13px;
        text-transform: uppercase;
        font-weight: 600 !important;
    }
    ul.nav li.dropdown:hover > ul.dropdown-menu {
        display: block;
        box-shadow: 1px 1px 5px #848383;
    }
    ul.nav li.dropdown:hover > ul.dropdown-menu >ul {
        position: absolute;
        right: 0;
    }
    .dropdown-menu {
        box-shadow: none;
        border-radius: 0;
        min-width: 220px;
        padding: 0;
        border: none;
        background: orange;
    }
    .dropdown-menu>li>a {
        padding: 14px 20px;
        color: #686664;
    }
    .dropdown-menu>.active>a,
    .dropdown-menu>.active>a:hover,
    .dropdown-menu>.active>a:focus {
        background-color: #f39c12;
        color: #fff !important;
    }
    .dropdown-menu ul.dropdown-menu {
        left: 100%;
        position: absolute;
        top: 1px;
        visibility: hidden;
        margin-top: -1px;
    }
    .dropdown-menu li:hover > ul.dropdown-menu {
        visibility: visible;
    }
    .dropdown:hover .dropdown-menu {
        display: block;
    }
    .nav-tabs .dropdown-menu,
    .nav-pills .dropdown-menu,
    .navbar .dropdown-menu {
        margin-top: 0;
    }
    .navbar .dropdown-menu > ul.dropdown-menu:before {
        border-bottom: 7px solid transparent;
        border-left: none;
        border-right: 7px solid rgba(0, 0, 0, 0.2);
        border-top: 7px solid transparent;
        left: -7px;
        top: 10px;
    }
    .navbar .dropdown-menu > ul.dropdown-menu:after {
        border-top: 6px solid transparent;
        border-left: none;
        border-right: 6px solid #fff;
        border-bottom: 6px solid transparent;
        left: 10px;
        top: 11px;
        left: -6px;
    }
    .menu-toggle,
    .main-navigation.toggled ul {
        display: block;
    }
    @media screen and (min-width: 37.5em) {
        .menu-toggle {
            display: none;
        }
        .main-navigation ul {
            display: block;
        }
    }
    .site-main .comment-navigation,
    .site-main .posts-navigation,
    .site-main .post-navigation {
        margin: 0 0 1.5em;
        overflow: hidden;
    }
    .comment-navigation .nav-previous,
    .posts-navigation .nav-previous,
    .post-navigation .nav-previous {
        float: left;
        width: 50%;
    }
    .comment-navigation .nav-next,
    .posts-navigation .nav-next,
    .post-navigation .nav-next {
        float: right;
        text-align: right;
        width: 50%;
    }
    
    #254280

    panditsearch.com

    any suggestions will be deeply appreciated,

    its directly under menu puja —-> vedicpuja —–> puja

    both vedic puja & puja disappear after clicking.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.