Why drafts: none is considered good practice?

Thanks to everyone. It was a very good discussion and clarified a lot for me.

I am working on an input field and want to remove the outline, but people say this is bad practice. I do not understand why. In the end, different browsers have different contours, and this eliminates uniformity.

Without circuit:

form input[type="text"],
form input[type="email"],
form input[type="password"],
form textarea {
  color: #000 !important;
  border: 2px solid #bdc3c7;
  border-radius: 6px;
  padding: 7px 13px; 
}
  form input[type="text"]:focus,
  form input[type="email"]:focus,
  form input[type="password"]:focus,
  form textarea:focus {
  outline: none; }

My thinking is that to increase uniformity it is better to get rid of the outline, but I believe that some will argue about accessibility. I could just add a border or shadow box for accessibility, and this will help the site look the same in all browsers:

form input[type="text"],
form input[type="email"],
form input[type="password"],
form textarea {
  color: #000 !important;
  border: 2px solid #bdc3c7;
  border-radius: 6px;
  padding: 7px 13px; 
}
  form input[type="text"]:focus,
  form input[type="email"]:focus,
  form input[type="password"]:focus,
  form textarea:focus {
  /* IMPORTANT */ box-shadow: 0px 0px 2pt 2pt #008bd1;
  outline: none; }

So, I still do not understand the argument that I have sketched: none of them is bad practice.

See this: http://jsfiddle.net/bCGZQ/

: , - , , .

+4
2

, .

, "" - TAB ( ). , . , .

http://www.outlinenone.com

+6

outline:none; .

:focus.

( , ) outline, (, border) . , , box-shadow ( , , , ..).

: Tab . , . , , .

+5

All Articles