Класс CSS не работает в Google Chrome, но отлично работает в IE и Mozilla. Что мне нужно изменить, чтобы оно работало во всех браузерах?

Question

Это мой пример кода, я использую его для текстового поля, чтобы изменить цвет его границ на синий, когда текстовое поле в фокусе. Он отлично работает в IE и Mozilla, но не работает в Google Chrome. Пожалуйста, помогите.

.inputTxtFld:focus {/* font-family: verdana,arial,sans-serif; font-size: 10px; color: #000000;*/
        MARGIN: 0px;
        PADDING-TOP: 2px;
        PADDING-RIGHT: 4px;
        PADDING-BOTTOM: 1px;
        PADDING-LEFT: 4px;
        WEBKIT-BORDER-TOP: #00c0f0 1px solid;
        WEBKIT-BORDER-RIGHT: #00c0f0 1px solid;
        WEBKIT-BORDER-BOTTOM: #00c0f0 1px solid;
        WEBKIT-BORDER-LEFT: #00c0f0 1px solid;
        FONT-FAMILY: Arial, Verdana, Geneva, Helvetica, sans-serif;
        FONT-SIZE: 11px;
        COLOR: #333;
        BACKGROUND-COLOR: #FFFFFF;

     }

Answer 1

.. или вы могли бы просто сделать;

border: 1px #00c0f1 solid;

Вам не нужен префикс поставщика, так как свойство CSS Border поддерживается всеми браузерами.

Answer 2

-WEBKIT-BORDER-TOP: #00c0f0 1px solid;
-WEBKIT-BORDER-RIGHT: #00c0f0 1px solid;
-WEBKIT-BORDER-BOTTOM: #00c0f0 1px solid;
-WEBKIT-BORDER-LEFT: #00c0f0 1px solid;

-MOZ-BORDER-TOP: #00c0f0 1px solid;
-MOZ-BORDER-RIGHT: #00c0f0 1px solid;
-MOZ-BORDER-BOTTOM: #00c0f0 1px solid;
-MOZ-BORDER-LEFT: #00c0f0 1px solid;

А для IE позже:

BORDER-TOP: #00c0f0 1px solid;
BORDER-RIGHT: #00c0f0 1px solid;
BORDER-BOTTOM: #00c0f0 1px solid;
BORDER-LEFT: #00c0f0 1px solid;

Answer 3

Для ясности, вам нужно указать префикс dash для стилей webkit, например:

-webkit-border-top: ...

Далее, строчными буквами все ваши атрибуты css.Иметь стиль, чувак!