The following css code, has added important, why it still shows white

.chatContent{
             color:black;
             margin-top:6px;
         }
         .chatContent.hisChatContent{
             color:black !important;
             margin-top:6px;
         }
Css
Jun.02,2021

.chatContent.hisChatContent

is there a space missing between the two class names? In general, important has the highest priority; you can check what the css of .hisChatContent is, and then modify the css selector
! important > inline style > ID selector > class selector > tag > wildcard > inheritance > browser default properties

How do you write

html?


suppose html structure:

`<p class="chatContent">hello

`

.chatContent.hisChatContent {} write this, and you need class= "chatContent hisChatContent" to take effect


or

controlled by js
Menu