[RÉGLÉ] font awesome - taille ne fonctionne pas fa-3x 4x 5x etc...

[jhommela]

Bonsoir,

impossible en utilisant ce bout de html dans un article de faire en sorte que les icons awesome augmentent de taille.
Il en est de même pour les rotations, mettre dans des cercles etc... Et cela sur toutes les pages du site d'ailleurs.
Basiquement les icons s'affichent tout de même.

Le code :

<i class="fa fa-chevron-right fa-3x pull-right"></i>

l'url de la font :

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" type="text/css" />

une idée de la provenance du problème ?

[lomart]

Re : font awesome - taille ne fonctionne pas fa-3x 4x 5x etc...

Bonsoir,

Il faut regarder avec un inspecteur de code (touche F12) si une autre règle à la priorité
ou nous fournir une url pour que l'on constate le problème

[jhommela]

Re : font awesome - taille ne fonctionne pas fa-3x 4x 5x etc...

Bonsoir Iomart et merci pour la rapidité,

je ne suis pas suffisamment au fait de l'utilisateur de l'inspecteur à ce jour. J'apprends doucement cet outil.
Voici l'url en question :

http://www.centre-kalachakra.fr/approfondir-l-etude-2

il s'agit de la petite flêche à droite du paragraphe "Présentation" dont il est question même si le problème est sur l'ensemble du site.

[lomart]

Re : font awesome - taille ne fonctionne pas fa-3x 4x 5x etc...

Il existe une règle dans /templates/favourite-kalachakra-01/css/template.css qui annule les autres

i[class^="fa fa-"], i[class*=" fa fa-"] {
    font-size: 18px;
    padding-right: 0.6em;
}

Je ne sais pas comment est chargé le css font-awesome.min.css, mais il faudrait le mettre après celui du template.
Et si cela ne suffit pas, il faudra supprimer la règle indiquée au début de mon post (et peut-être d'autres)

[jhommela]

Re : font awesome - taille ne fonctionne pas fa-3x 4x 5x etc...

Merci mille fois!
J'ai compris un principe de fonctionnement.

Bonne vacances

[jhommela]

Re : font awesome - taille ne fonctionne pas fa-3x 4x 5x etc...

Ce qui reste curieux toutefois c'est qu'il existe une différence de positionnement vertical en un pull-right et un sans pull-right

Sans pull-right l'icone est bien aligné horizontalement à la suite du texte: tout va bien.
Avec pull-right l'icone en se positionnant complètement à droite se positionne également légèrement au dessus de l'alignement horizontal du texte.

[lomart]

Re : font awesome - taille ne fonctionne pas fa-3x 4x 5x etc...

C'est du au fait que le pull-right fait sortir le texte du flux courant. Une solution simple est de le compenser par une règle comme :
.fa-chevron-right.pull-right {margin-top:10px}

[jhommela]

Re : font awesome - taille ne fonctionne pas fa-3x 4x 5x etc...

Merci mille fois Iomart !!