Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #1123074

    I’m referring to the line that is shown below a top menu item, like the thin red line in this demo:

    On our site, it is shown as a thick line above the item before scrolling. After scrolling (and shrinking of the menu), it is shown below the item, but much too close to the text.

    Before scrolling: https://i.imgur.com/CBVniTn.png
    After scrolling: https://i.imgur.com/8QSyNnz.png

    How can we make it more similar to the demo line (thinner, always below the items and fixed on the line between menu and body)?

    #1123091

    Hey apajo,

    Can you give us a link to your site? so we can check further.

    Best regards,
    Nikko

    #1123203

    Sure, please see private content.

    #1123384

    Hi apajo,

    Thanks for giving us the link, can you try adding this css code in Quick CSS (located in Enfold > General Styling):

    #top #avia-menu .avia-menu-fx {
        top: auto;
        bottom: 0;
    }

    Best regards,
    Nikko

    #1124325

    Hi Nikko

    Thank you for your reply.
    I tried the code but can’t see any change.

    Not sure if it helps finding the source of the issue but here is the entire Quick CSS code I found on our site:

    .alternate_color strong, .main_color strong { color: black; }

    .sidebar li a {
    color: grey !important;
    font-family: ‘Ubuntu’;
    font-style: normal;
    font-size: small;
    }

    .main_menu ul:first-child>li>a {
    font-size: 16px;
    font-color: white;
    }
    .main_color tr:nth-child(even) {
    color: #121212;
    }
    #top ul:first-child > li > a {
    color: white;
    }
    #top ul:first-child > li > a:hover {
    color: white;
    }

    .avia-icon-list .iconlist_icon {
    height: 32px;
    width: 32px;
    line-height: 32px;
    font-size: 20px;
    margin: 0 30px 0 16px;
    }

    /* MENU BORDERS */
    #top .main_menu .menu ul li a {
    border-right-style: solid;
    border-right-color: #ffffff;
    border-right-width: 1px;
    border-left-style: solid;
    border-left-color: #ffffff;
    border-left-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #ffffff;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-top-color: #ffffff;
    border-top-width: 1px;
    }

    /* Main Menu – SUB MENU OFF */
    #top .main_menu .menu ul li>a {
    color: #ffffff;
    font-weight:600;
    }
    /* Main Menu – SUB MENU HOVER */
    #top .main_menu .menu ul li>a:hover {
    color: #f16e50 !important;
    background-color: #ffffff;
    font-weight:600;
    }
    /* Main Menu – HIGHLIGHT BLOCK */
    #top .avia-menu-fx {
    display:block;
    position:absolute;
    top: 28px;
    border-style:solid;
    border-width:1px;
    color: #ffffff !important;
    }
    #top #avia-menu .avia-menu-fx {
    top: auto;
    bottom: 0;
    }

    #top fieldset > h3 {
    display: none;
    }

    .page-id-3542 #main img {
    border: 5px solid red !important;
    }

    .recentcomments a, .widget_recent_entries li a {
    font-style: normal !important;
    font-family: “Ubuntu” !important;
    }

    div#header_main {
    background-color: #f16e50;
    }

    .avia_mega_div * {
    font-size: 16px !important;
    }

    .home .av-masonry-date {
    display: none !important;
    }
    .avia-content-slider .slide-meta time {
    display: none;
    }

    #1124659

    Hi apajo,

    I tried to check your site again and it works properly on my end, maybe it’s still fetching css from the browser cache on your end, try clearing your browser cache.
    This is the only code that’s not valid:

    font-color: white;

    It should just be color but it won’t affect other codes.

    Best regards,
    Nikko

    #1124705

    Hi Nikko
    Tried again and it’s working.
    Thank you for your help!

    #1124871

    Hi apajo,

    Glad you got it working for you! :)

    If you need further assistance please let us know.

    Best regards,
    Victoria

    #1125120

    Just one follow-up question: how can the thickness of the line be increased?

    #1125157

    Hi apajo,

    Just replace the code I gave:

    #top #avia-menu .avia-menu-fx {
        top: auto;
        bottom: 0;
    }

    with:

    #top #avia-menu .avia-menu-fx {
        top: auto;
        bottom: 0;
        border-width: 2px;
    }

    Just adjust the border width value.

    Best regards,
    Nikko

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