Почему псевдоклассы не работают в Google Chrome и IE

(!!!Есть похожая тема, но я не нашёл в ней ответы на свои вопросы, поэтому огромная просьба не помечать мой вопрос как дубликат!!!)

В браузерах Google Chrome, Firefox, IE submit работает как надо. И всё остальное в Firefox тоже работает так, как надо. Но в IE не работает псевдокласс focus (текст просто стирается при нажатии на элемент формы). А в Хроме не появляются стили указанные для класса text (т.е. текст-подсказка для ввода не выделяется красным цветов) и не работает focus(текст не выделяется зелёным при нажатии на поле ввода текста). Что с этим делать? Как это исправить?

  input { 
   color: #ffffff; 
  } 
   input.submit:hover { 
    background-color: #665544; 
   } 
   input.submit:active { 
    background-color: chocolate; 
   } 
   input.text { 
    color: red; 
   } 
   input.text:focus { 
    color: green; 
   }

  <input class="text" type="text" placeholder="Введите электронную почту"/> 
  <input class="submit" type="submit" value="Отправить запрос"/>