fontawsome bug?

fairyjo

Hello,

Towards the bottom of this page https://www.entr-actes.ch/nouveau/qui-nous-sommes I'm using fontawesome bullet points but since I added them the font for this part has changed.

Also, why won't they all go to the next line after the </li> code?

Could you help me fix it?
Thanks a lot in advance, sincerely, Joanie

saguaros

Hi fairyjo

Could you share some screenshots illustrating how you want to achieve?

fairyjo

hello saguaros

Thanks for getting back to me, this is what it looks like now:

But I want to have the hats as bullet points and I want the default website font.

I don't understands why all bullet points will not go to the next line nor why the font has changed.

I don't know how to fix it, all the </li> are there at the end of the lines and the code looks all right to me. Please help. Thanks, Joanie

saguaros

Hi fairyjo

Try to use this custom css:

.itemid-106 .t3-content .item-page .article-content ul li.fa.fa-graduation-cap {
  display: block;
}

fairyjo

Hello saguaros,
So the code you gave me fixed the arrangement of the hat-bullets, but the font is aweful 🙁

When I try to change the font by adding

font-family: "PTRootUI",Helvetica,Arial,sans-serif

I get this

I tried many things but can't find a way to have the standard font of the template and the hat-bullets show together. Can you help ?
Many thanks in advance, cheers, Joanie

saguaros

fairyjo

fa fa-graduation-cap belongs to FontAwesome but you adde css to force to use other font: font-family: "PTRootUI",Helvetica,Arial,sans-serif . Of course, it will not work.

You can try to override again with this css:

.itemid-106 .t3-content .item-page .article-content ul li.fa.fa-graduation-cap::before {
    font-family: fontawesome !important;
}

fairyjo

Fantastic, thanks a lot saguaros, it works perfectly now, I just adjusted the line height and now I have a nice hat-bullets block of text.

Thanks again, you can close this thread. Cheers, Joanie