How to fix redefinition warnings from CSS Validator?

Question

I just ran my site through the W3C CSS Validator and it came out with a total of 3146 warnings.

Most of them are redefinition warnings like these:

.fa.fa-check    Redefinition of color
.fa.fa-check    Redefinition of color
.fa.fa-check    Redefinition of font-size
.fa.fa-check    Redefinition of font-size
.fa.fa-check    Redefinition of background-color
.fa.fa-check    Redefinition of background-color
.fa.fa-check    Redefinition of display
.fa.fa-check    Redefinition of display
.fa.fa-check    Redefinition of height
.fa.fa-check    Redefinition of height
.fa.fa-check    Redefinition of line-height
.fa.fa-check    Redefinition of line-height
.fa.fa-check    Redefinition of width
.fa.fa-check    Redefinition of width
.fa.fa-check    Redefinition of text-align
.fa.fa-check    Redefinition of text-align

This is the script:

.fa.fa-check 
{
    color: #81D742;
    font-size: 3em;
    background-color: #F7F7F7;
    border: 2px solid #DCDCDC;
    border-radius: 110px;
    display: inline-block;
    height: 110px;
    line-height: 110px;
    width: 110px;
    text-align:center;
    padding: 0px;
}

I can't figure out what to change for these warnings to disappear.

From what I've read, the redefinition warnings usually appear when there is a duplicate definition in the style sheet, but the only problem is that I can't find any duplicate definitions.

Does anyone have any tips or tricks to fix this?

Answer 1

You have several instance of the .fa.fa-check in your website. the css validator considerate you try to redefine the class.

Try to let only one instance of yout .fa.fa-check classes and it will solve the issue one this class.