Google chrome yellow outilne can't be removed

Question

i used the css property to remove the yellow outline from google chrome but still no result back it is always there and i tried all the options i found outher such as:

input[type="text"]:focus {outline:none;}

input:focus {outline:none;}

input[type="text"]:focus {outline-style:none;box-shadow:none;border-color:transparent;}

Answer 1

try to add (!important)

   input[type="text"] .btn:focus {
   outline-color: transparent !important;
   }

   input:focus {outline:none !important;}

   input[type="text"]:focus {outline-style:none;box-shadow:none;border-color:transparent !important;}