Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1155122

    Hi,

    On my site I’m using tabs from the Layout Builder. When I click a tab, there comes a blue border around it. I’m using Chrome, looking at it in Firefox, it’s grey and dotted. I know the phenomenon with images, but haven’t seen this one before. Can anyone tell me how to get rid of the border? See the url in the private part below.

    Regards,
    Erwin

    • This topic was modified 1 week ago by  Erwin.
    #1155274

    Hey Erwin,
    Thank you for the link, this is sort of new, it is coming from the browsers for “A11y” or “ARIA”, for people with visual impairment. So the classic css “reset” used to set “outline” to “none” or zero but now as “we” (as in all developers) are preparing for new “A11y” standards, this practice is discouraged so now the browsers are showing the styles that they have been including in the “agent stylesheet” Anyways, please try this css to remove:

    #top .main_color .tab:focus {
      outline: 0 !important;  
      outline: 0 -webkit-focus-ring-color !important; 
    }

    but perhaps a better solution would be to style it with your sites colors, such as this 1px slightly darker outline, please adjust it to the most you are willing to go keeping in mind of our visually impaired visitors and friends :)

    #top .main_color .tab:focus {
      outline: #DBDBDB solid 1px !important;  
      outline: #DBDBDB solid 1px -webkit-focus-ring-color !important; 
    }

    Best regards,
    Mike

    #1155506

    Hi,

    That did it indeed. Thanks!

    Regards,
    Erwin

    #1155546

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    For your information, you can take a look at Enfold documentation here
    For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)

    Best regards,
    Mike

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Remove blue border around tab’ is closed to new replies.