This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Prevent Selection Box

  • Creator
    Topic
  • #10275
    piradyne
    Participant

    http://i39.tinypic.com/16jpp44.png

    Hi, for some reason in version 2.00, when I click on anything such as the logo and the social icons for example, there is a visible selection thingy now. I don’t remember seeing this before. How can I turn this off. Click on a social icon and the selection is all the way across the top of the header area. Very distracting and annoying.

    Thanks

    Jarrod

Viewing 7 replies - 1 through 7 (of 7 total)
  • Author
    Replies
  • #10289
    Jason Bobich
    Keymaster

    Can you provide me a link where I can see the issue on your site out of maintenance mode? And what web browser is your screenshot in?

    #10295
    piradyne
    Participant

    here: http://piradyne.com

    You know it maybe related to FireFox. I just viewed in IE10 (win 7), and I do not see this problem nor do I see the thing where when the page refreshes it turns white for a moment, then everything renders (in FireFox). Funny though, in IE, my logo does not show up. Sigh. All of this is making me crazy. I currently have 22.0, I see and update coming down, may make a difference.

    Jarrod

    #10300
    Jason Bobich
    Keymaster

    All right got it, try putting this in your child theme’s style.css:

    .themeblvd-contact-bar li a {
    	outline: none;
    }

    Does that solve the issue?

    #10310
    piradyne
    Participant

    Hi, thanks yes, for the social icons, but how can I do this everywhere? When you click on the logo, in side woocommerce, everwhere you can click on something there is that selection box, that I do not remember being there in the prev version. Is there someplace in css where I can turn outline off for all elements?

    Thanks

    Jarrod

    #10313
    piradyne
    Participant

    Hmm… I was just reading here: http://www.outlinenone.com/

    That it should be enabled for accessibility. I never thought about that as I always use a mouse. Sigh. What are you thoughts about this?

    Thanks

    Jarrod

    #10314
    piradyne
    Participant

    a, a:visited, a:focus, a:active, a:hover{
    outline:0 none !important;
    }

    This seems to work btw. Do give me your thoughts on accessibility.

    Thanks

    Jarrod

    #10318
    Jason Bobich
    Keymaster

    I’m not sure why the outline is messed up with the social icons, where it stretches across, so I would say hiding it in this specific case is more preferable. However, in general, a lot of people coming into web design fresh tend to not like the outline property not fully understanding what it is.

    Realistically, this does not impact design very much, as it only happens when you click something. But in terms of accessibility, it is natural thing to have and why web browsers are setup with this by default. For example, someone that is navigating your site that doesn’t have use of a mouse for whatever reason might have some software where they’re moving through the links (or pressing tab on the keyboard) — this allows them to know what they’re selecting.

    Additionally for accessibility, many places in the framework’s CSS where we’re styling the :hover pseudo class, we also style the the :focus pseudo class, as well. This allows whatever hover effects we’re giving normal users (i.e. a button lighting up or something) to happen with someone using one of the screen reader applications tabbing through links, as well.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The forum ‘Akita Responsive WordPress Theme’ is closed to new topics and replies.