Help - Custom css - Underlining mobile navigation menu overlay

Site URL: https://www.c2eventz.com/

Good day everyone,

I am trying to inject custom css to my mobile navigation menu using the 7.1 Clarkson template. On mobile version only, when you click the hamburger style navigation button, I would like (Home, About, and Technology) underlined to show it is a clickable link.  Most people understand how websites and mobile versions work but my clients are not as savvy. To show them it's a clickable link, I would like them underlined to show that. Any help would be greatly appreciated.

Add to Home > design > Custom CSS

/* Mobile item underline */
.header-menu-nav-folder-content a {
    text-decoration: underline;
}

I really appreciate that @tuanphan

Now, moving forward, can I move the underline a couple pixels down as the g & y on technology become conflicting together? Again, thanks for your time and effort.

Joe 

@tuanphan disregard, I got it with:

/* Mobile item underline */
.header-menu-nav-folder-content a {
    text-decoration: underline; text-underline-position: under;
}

Look ok? Thanks a million! Check inbox.

Joe

you can also use this CSS, you can adjust underline width, color,...

.container.header-menu-nav-item a {
    display: inline-block;
}
.container.header-menu-nav-item a:after {
    content: "";
    display: block;
    height: 3px;
    width: 100%;
    background: white;
    margin-top: 10px;
}

You are the best! Thanks for the options.

@tuanphan you don't happen to know how to add line breaks between your nav folders in the mobile menu overlay? also still on the topic of mobile menu overlay, do you know if is possible to have the font size larger of the nav folder than the font size of the pages within the folders? hope that makes sense? thanks so much in advance. Ross

Site is https://flatworm-finch-f4nw.squarespace.com/config/design/custom-css 

On 12/3/2020 at 7:34 PM, RossHarrison_1313 said:

@tuanphan you don't happen to know how to add line breaks between your nav folders in the mobile menu overlay? also still on the topic of mobile menu overlay, do you know if is possible to have the font size larger of the nav folder than the font size of the pages within the folders? hope that makes sense? thanks so much in advance. Ross

Site is https://flatworm-finch-f4nw.squarespace.com/config/design/custom-css 

I don't see nav menu. Can you share link to exact page?