Семантический интерфейс - Почему нет сообщения внутри формы?

Question

Я использую Semantic-UI и я пытался добавить предупреждение message к моему Form, как это:

<form> 
    ...stuff... 
    <div class="ui warning message"> 
     <div class="header"> 
      Title of the message 
     </div> 
     Text of the message 
    </div> 
</form> 

Но по какой-то причине он не показывал вообще на этой странице. Только после того, как я узнал, что это связано с тем, что внутренние CSS-правила SemanticUI явно скрывают сообщения внутри форм. От semantic.min.css:

.ui.form .error.message, .ui.form .success.message, .ui.form .warning.message { 
    display: none; 
} 

Почему это? Могу ли я переопределить его? Есть ли причина, почему я не должен?

Answer 1

Ну, я не уверен на 100% , но я угадываю, что классы /success/warning используются для сообщений проверки формы, поэтому они скрыто по умолчанию. Я решил проблему с помощью определенного класса цвета, а не warning один:

<form> 
    ...stuff... 
    <div class="ui yellow message"> 
     <div class="header"> 
      Title of the message 
     </div> 
     Text of the message 
    </div> 
</form> 

Это прекрасно работает и визуально неотличимы от warning один.

Answer 2

ваша запись в CSS .formclass но вы не привыкли к .formclass, так что вы можете использовать только formtag в вашем CSS

попробовать эту

form .ui.error.message, 
form .ui.success.message, 
form .ui.warning.message { 
    display: none; 
} 

Answer 3

У меня также была та же проблема. Не уверен, что у вас уже есть ответ, но для других, посещающих этот пост:

оберните вас <form> с <div> с классом «ошибка формы ui».

Е.Г.,

<div class="ui form error"> 
<form class="some class" method="POST" action="/some_acton"> 
..fields.. 
</form> 
</div> 

или

<form class="ui form error your_class" method="POST" action="/some_action"> 
..fields.. 
</form>