CSS Firefox - How to Deactivate The Dotted Border ( Firefox Click Indicator )

CSS Firefox - How to deactivate the dotted border ( firefox click indicator )?

Provided that your menu items are not input elements (say, buttons), you can hide it using CSS, like so:

element { outline: none; }

How to remove Firefox's dotted outline on BUTTONS as well as links?

button::-moz-focus-inner {
  border: 0;
}

How to remove the Dotted Border on clicking?

Possible with pure HTML as well:

<a href="..." hidefocus="hidefocus">...</a>

And with JavaScript you can do that on all links:

window.onload = function WindowLoad(evt) {
   //hide focus:
   var arrLinks = document.getElementsByTagName("a");
   for (var i = 0; i < arrLinks.length; i++) {
       arrLinks[i].hideFocus = "true";
}

how to remove the dotted line around the clicked a element in html

Use outline:none to anchor tag class

How to remove the border highlight on an input text element

Before you do that, keep in mind that the focus outline is an accessibility and usability feature; it clues the user into what element is currently focused, and a lot of users depend on it. You need to find some other means to make focus visible.

In your case, try:

input.middle:focus {
    outline-width: 0;
}

Or in general, to affect all basic form elements:

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}

---

In the comments, Noah Whitmore suggested taking this even further to support elements that have the contenteditable attribute set to true (effectively making them a type of input element). The following should target those as well (in CSS3 capable browsers):

[contenteditable="true"]:focus {
    outline: none;
}

Although I wouldn't recommend it, for completeness' sake, you could always disable the focus outline on everything with this:

*:focus {
    outline: none;
}

Modify div onclick outlining in firefox

In CSS:

a:active{outline:0;border:(customize the border around the active link)}

For a div (using JQuery):

$(function(){ 
    $('div#your-id').click(function(){ 
        $(this).css({'enter the CSS rules for the div here'}); 
    }); 
});

http://docs.jquery.com/CSS/css#name

---

Related Topics