How to alter outline on active link item in header?

Solved
CrabShopper
New Member
12 0 0

Hello, active link item in my interface on debut has a black outline under it. I cannot figure out how to make the outline two pixels instead of one. 

I tried altering this block code, but the pixel size of the border seems to have no effect on this element. And i've looked everywhere I can think and I cannot figure out where the css instruction to draw this line is, if it's not here. 

 

 

 

.site-nav__link.site-nav--active-dropdown {
  border: 1px solid var(--color-border);
  border-bottom: 1px solid transparent;
  z-index: 2; }

 

 

 

 

0 Likes

Hello,
Please share your site url.
So that I can check and let you know the exact solution here.

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
CrabShopper
New Member
12 0 0

This is an accepted solution.

Hello,
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.css

li.site-nav--active span.site-nav__label {
    border-bottom: 2px solid var(--color-text);
}
If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
CrabShopper
New Member
12 0 0

Thank you!

0 Likes