Css 表单内语义UI输入元素处于错误状态

请看下面的图片。如您所见，CSS将使输入在出现

ui输入错误时立即显示为错误样式。
然而，当放置在
ui表单
中时，我假设这是一个非常常见的用例，同样的类会被来自
ui表单
的更具体的选择器所覆盖：
.ui.form输入[type=…]
。导致
错误
类完全无效

我也尝试将
error
作为状态添加到父
表单
div中-没有效果。到父
段
-无效

演示显示无表单的工作版本：

演示显示非工作版本的表单：

为什么?？表单中有错误的输入的假定用途是什么？
在表单中执行错误状态的正确方法是使用
.field将输入包装在
中。error
类如下：




查看更多详细信息
添加了两种情况的演示
<div class="ui form">
    <div class="ui input">
        <div class="field error">
          <input placeholder="Search..." type="text">
        </div>
  </div>
</div>