How can I change the underline to a rounded box to make my navigation looks like a button to show the page state + drop shadow when hover over?

Hi all

Is there any way that I can change the underline to a rounded box (gradient color from #E2E558 to #ED8261) to make my navigation looks like a button to show the page state + drop shadow when hover over?

Many thanks!

Reference image attached. Many thanks!

15 hours ago, Kacy-Jung said:

Hi all

 

Is there any way that I can change the underline to a rounded box (gradient color from #E2E558 to #ED8261) to make my navigation looks like a button to show the page state + drop shadow when hover over?

 

Many thanks!

 

Reference image attached. Many thanks!

Can you share your URL so I can check it?

It's kacy-jung.com! 

Thank you!

On 6/27/2024 at 3:18 AM, Kacy-Jung said:

It's kacy-jung.com! 

Thank you!

You can use this to Custom CSS

div.header-nav-item--active>a {
    background-image: linear-gradient(to right, #E2E558, #ed8261) !important;
    background-size: auto !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
    border-radius: 10px !important;
}