CSSクラスはborder-styleをオーバーライドしません

Question

すべてのテキストフィールドのスタイルを灰色の枠で、class="form_field_error"のフィールドに対しては、境界線の色を赤色に変更します。

私は次のコードを試しましたが、以前定義したボーダーをオーバーライドするクラスを取得できません。私は何が欠けていますか？

HTML：

<input type="text" name="title" id="title" class="form_field_error"> 

はCSS：

input[type="text"] { 
    display: block; 
    height: 15px; 
    font-weight: normal; 
    color: #777; 
    padding: 3px; 
    border-top: 1px solid #aaa; 
    border-left: 1px solid #aaa; 
    border-bottom: 1px solid #ccc; 
    border-right: 1px solid #ccc; 
    -webkit-border-radius: 3px; 
    -moz-border-radius: 3px; 
    border-radius: 3px; 
} 

.form_field_error { 
    border: 1px solid #f00; 
} 

私は、問題を説明するためにjsFiddleを作成しました。

Answer 1

はこれを試してみてください：

.form_field_error { 
    border: 1px solid #f00 !important; 
} 

Answer 2

赤い枠線を適用するdivを指定してみましたか？

input.form_field_error { 
    border: 1px solid red; 
} 

そして、サイドノートに - 「タイトルは」はただ1つまたはあなたがそれを再利用を考えているためであるとして、あなたが設定されたID？

あなたも行うことができますので - >

#title.form_field_error { 
    border: 1px solid red; 
} 

Answer 3

input[type="text"] CSSは.form_field_error CSSよりも優先されます。

input.form_field_errorに変更すると、境界線が機能します。