內部錯誤狀態下的語義UI輸入元素

Question

看看example for an input in error state。正如你所看到的，只要它有ui input error作爲類，CSS將使輸入顯示錯誤樣式。 然而，當放置在ui form內時，我會假設一個非常常見的用例，那些非常相同的類將被來自ui form：.ui.form input[type=...]的更具體的選擇器取代。導致error類完全沒有效果。

我確實嘗試將error作爲狀態添加到父母form div - 沒有效果。父母segment - 無效。

演示顯示了不帶形式的工作版本：https://jsfiddle.net/hahz35ka/

演示展示與形式的非工作版本：https://jsfiddle.net/hahz35ka/1/

爲什麼？表單中有錯誤的輸入的假設用法是什麼？

Answer 1

的正確方法的形式做了一個錯誤狀態是包裝輸入的<div>與.field .error類，如下列：

[demo]

<div class="ui form"> 
    <div class="ui input"> 
     <div class="field error"> 
      <input placeholder="Search..." type="text"> 
     </div> 
    </div> 

退房Form Validation更多細節