[ChristopherModerator]

Hi there,

@media (max-width:530px){} means the code within media query only works for screen sizes which are smaller than 530px.

Please add this CSS as well :

a:focus, select:focus, input[type="file"]:focus, input[type="radio"]:focus, input[type="submit"]:focus, input[type="checkbox"]:focus {
    outline: none;
}

Hope it helps.

[mayurdParticipant]

Hello,
I’m sorry but that didn’t do the trick. Do let me know about any changes. Thank you.

-Mayur

[Paul RModerator]

Hi Mayur,

You can try this code instead.

.x-navbar .desktop .x-nav > li > a:hover, 
.x-navbar .desktop .x-nav > .x-active > a, 
.x-navbar .desktop .x-nav > .current-menu-item > a {
    outline:none;
    box-shadow: none;
}

Hope that helps.

[mayurdParticipant]

Hello Themeco Staff,

Sorry but that didn’t work either.

-Mayur

[ZeshanMember]

Hi Mayur,

Please try this CSS code, it should work fine:

.x-navbar .desktop .x-nav > li > a:hover, 
.x-navbar .desktop .x-nav > .x-active > a, 
.x-navbar .desktop .x-nav > .current-menu-item > a,
.x-navbar .desktop .x-nav a:focus {
    outline:none;
    box-shadow: none;
}

Thank you!

[mayurdParticipant]

Sorry, still no results.

[FriechModerator]

Hi There,

I’m not seeing the code under Custom > CSS in the Customizer. Please add the code and clear your browser’s cache.

.x-navbar .desktop .x-nav > li > a:hover, 
.x-navbar .desktop .x-nav > .x-active > a, 
.x-navbar .desktop .x-nav > .current-menu-item > a,
.x-navbar .desktop .x-nav a:focus {
    outline:none !important;
    box-shadow: none !important;
}

Thanks!

[mayurdParticipant]

That was because I had tried putting the code in my css while using my browser’s developer mode and it made no change. I have added the code to the file now and it still makes no change. Do let me know what to do next.

Thank you,
Mayur.

[ChristopherModerator]

Hi there,

The provided code in previous replay has removed outline from <a> tag, still there is another outline around <span> tag, please check the attachment and confirm if it’s what you’re referring to .

Please add this as well:

span:focus {
    outline: none;
}

Hope it helps.

[mayurdParticipant]

Hello Themeco staff,

I added the code and while the random underlines have gone, there is still a white-space box above each list item(About, Contact etc.) which links to the respective places. I’ve tried on Chrome and Safari and it doesn’t seem to work. I’ve attached a few screenshots to illustrate.

Thank you for your patience and promptness
-Mayur

[RupokMember]

Hi there,

Thanks for updating. It’s because you have added this code :

.x-navbar .desktop .x-nav > li > a {
  height: 15px;
  padding-top: 45px;
}

Let’s remove it to get expected result. If you want spacing above, use margin instead of padding to get space without stretching the link area.

Cheers!

[mayurdParticipant]

Thanks a ton! It finally worked! I made the change in the X theme customiser.

-Mayur

[ChristopherModerator]

We are happy that we could help you with this.

[Author]

Posts