Strange border on tabIndex on <p> element

Although not the most efficient CSS selector by any means you can remove this from all DOM elements with tabindex attributes just the following CSS:

[tabindex] {
   outline: none !important;
}

I have a better solution to this issue, hybrid javascript/css.

$('[tabindex]').focus(function()
{
    $(this).css('outline', 'none');
});
$('[tabindex]').keyup(function (event)
{
    if(event.keyCode == 9)
    {
        $(this).css('outline', '');
    }
});

This way it still works if you tab through, but not if you click.

whats about:

#content div.showHide p.showHideTitle {
    outline: none !important; 
}

You are setting the outline style for the pseudo class :focus but this may be "to late". Here a simple jsFiddle