[Solved] icons not displaying correctly

try this code for the icons

#wpforo #wpforo-wrap i[class*="fas"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap i[class*="far"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap i[class*="fab"]::before {
    font-family: "Font Awesome 5 Brands" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap .fas, 
#wpforo #wpforo-wrap .far,
#wpforo #wpforo-wrap .fab {
    text-decoration: none !important;
}

2 Replies

rainerpuschner

(@rainerpuschner)

Joined: 4 years ago

Active Member

Posts: 13

Oct 28, 2021 6:53 pm

Translate ▼

@tutrix THANK YOU!!! Your CSS Code just works perfectly!

rainerpuschner

(@rainerpuschner)

Joined: 4 years ago

Active Member

Posts: 13

Oct 28, 2021 6:55 pm

Translate ▼

Oh no! There is still one missing!

Posts: 13

rainerpuschner

Topic starter

Translate ▼

Oct 28, 2021 6:56 pm

(@rainerpuschner)

Active Member

Joined: 4 years ago

And this one (or is it the same?)

Posts: 13

rainerpuschner

Topic starter

Translate ▼

Oct 28, 2021 6:59 pm

(@rainerpuschner)

Active Member

Joined: 4 years ago

And what to do here?

8 Replies

Tutrix

(@tutrix)

Joined: 6 years ago

Noble Member

Posts: 1519

Oct 28, 2021 7:01 pm

Translate ▼

add this too

#wpforo #wpforo-wrap i[class*="fa-layer-group"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}

#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="text"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="password"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="email"] {
    padding: 10px 20px 10px 34px !important;
}

rainerpuschner

(@rainerpuschner)

Joined: 4 years ago

Active Member

Posts: 13

Oct 28, 2021 7:15 pm

Translate ▼

@tutrix Yeah! Its getting better from time to time! THANK YOU SO MUCH!

This onei s still missing

Tutrix

(@tutrix)

Joined: 6 years ago

Noble Member

Posts: 1519

Oct 28, 2021 8:00 pm

Translate ▼

you must use the complete code I posted above

rainerpuschner

(@rainerpuschner)

Joined: 4 years ago

Active Member

Posts: 13

Oct 28, 2021 9:07 pm

Translate ▼

@tutrix i did!

This is the whole Code in the CSS section of wpforo:

#wpforo-wrap {
   font-size: 13px; width: 100%; padding:10px 0; margin:0px; border-radius: 5px;
}


#wpforo #wpforo-wrap i[class*="far"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap i[class*="fab"]::before {
    font-family: "Font Awesome 5 Brands" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap .fas, 
#wpforo #wpforo-wrap .far,
#wpforo #wpforo-wrap .fab {
    text-decoration: none !important;
}

#wpforo #wpforo-wrap i[class*="fa-layer-group"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}

#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="text"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="password"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="email"] {
    padding: 10px 20px 10px 34px !important;
}

Tutrix

(@tutrix)

Joined: 6 years ago

Noble Member

Posts: 1519

Oct 28, 2021 9:10 pm

Translate ▼

and why not completely?

rainerpuschner

(@rainerpuschner)

Joined: 4 years ago

Active Member

Posts: 13

Oct 28, 2021 9:18 pm

Translate ▼

@tutrix Did i miss some snippet? Thats all code snippets you showed to me, isnt it?

Tutrix

(@tutrix)

Joined: 6 years ago

Noble Member

Posts: 1519

Oct 28, 2021 10:07 pm

Translate ▼