How to remove yellow border comes around the textbox in Chrome & Safari

Question

i have a html page.While i take the page in chrome or Safari , there is a yellow border around the text box.

For removing the border,i have added

<style type="text/css">
  input{
  outline:none;
}
</style>

And the border has gone.

But while i take the page in Mac machine (chrome & Safari).it still there. Anyone have idea of how to fix it in Mac?

Answer 1

:focus {
  outline: 0;
  outline-color: transparent;
  outline-style: none;
}