LivAils Posted October 31, 2019 Share Posted October 31, 2019 Hello, I would like to underline each individual menu item when you hover over it. What CSS would I use to do this? I may also want to keep it underlined when that page is active. Please could you pass on the CSS for this also. Thanks, Liv https://greyhound-keyboard-sa3k.squarespace.com/ Link to comment
tuanphan Posted October 31, 2019 Share Posted October 31, 2019 @LivAils Add to Home > Design > Custom CSS /* Hover */ nav.main-nav a:hover { border-bottom: 1px solid currentColor !important; } /* Active */ nav.main-nav .active-link a { border-bottom: 1px solid currentColor; } You can also use text-decoration: underline; but i like border-bottom LivAils 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
LivAils Posted November 1, 2019 Author Share Posted November 1, 2019 Perfect thank you! Link to comment
tuanphan Posted November 1, 2019 Share Posted November 1, 2019 Just now, LivAils said: Perfect thank you! You're welcome. Reference: Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
christinemcmillen7 Posted August 24, 2021 Share Posted August 24, 2021 @tuanphan would you have a code to do this exact thing but use an image or even a .gif for the underline? I’m looking to do this but with a squiggly line, ideally a squiggly line that squiggles as it’s hovered over Link to comment
tuanphan Posted August 27, 2021 Share Posted August 27, 2021 On 8/24/2021 at 8:47 PM, christinemcmillen7 said: @tuanphan would you have a code to do this exact thing but use an image or even a .gif for the underline? I’m looking to do this but with a squiggly line, ideally a squiggly line that squiggles as it’s hovered over Hi. This is possible. I used to solve some cases. Can you share link to your site? Each items will need a different image or same image? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Ogloza Posted March 11 Share Posted March 11 Hi @tuanphan, just wanted to say I've used SO many of your tips on this forum - thanks for what you do! I'd love to add an underline to my client's menu, as well as each of the sub-menu items when they are hovered. I tried the above code but it didn't work for me. Would you mind if I DM you the website title and password? Thanks! Link to comment
tuanphan Posted March 12 Share Posted March 12 On 3/11/2023 at 8:32 AM, Ogloza said: Hi @tuanphan, just wanted to say I've used SO many of your tips on this forum - thanks for what you do! I'd love to add an underline to my client's menu, as well as each of the sub-menu items when they are hovered. I tried the above code but it didn't work for me. Would you mind if I DM you the website title and password? Thanks! Yes. You can send, we can check easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SummerKateDesigns Posted April 10 Share Posted April 10 @tuanphan Hi there, I am also trying to achieve the same underline hover & active effect but I would like to have a slight animation where the underline appears from left to right? Can I message you my URL and site password to help? 🙂 Link to comment
tuanphan Posted April 12 Share Posted April 12 On 4/10/2023 at 12:36 PM, SummerKateDesigns said: @tuanphan Hi there, I am also trying to achieve the same underline hover & active effect but I would like to have a slight animation where the underline appears from left to right? Can I message you my URL and site password to help? 🙂 Yes. You can send, we can check code easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment