Taille police dans CSS

[doriane74]

Détails techniques

Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Plusieurs utilisateurs
Problème apparu depuis : 28 mars
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonjour,
Plusieurs personnes se plaignent da la taille de la police - trop petite - dans la lecture et la rédaction des posts. Pourtant j'ai agrandi dans CSS

Police titre : TrebuchetMS

Police principale : Verdana,Arial,Helvet

Police code : courrier,'CourrierNew'

Taille police principale : 20 (auparavant elle était à 15)

Moi, je vois en plus gros mais les autres personnes non

Je ne vois pas d'où vient le problème, si vous pouviez m'apporter votre aide, ce serait super.
Merci par avance, bien amicalement

[doriane74]

exemple :

[doriane74]

PS : taille police plus grande uniquement dans la lecture et la réponse des messages (le reste ne doit pas changer)
Merciiiii

[doriane74]

Bonsoir,
Toujours pas de réponse à mon problème (désolée mais c'est un forum privé) et je ne peux pas le mettre en "clair'
En souhaitant être dépannée, merci par avance.

[MlleAlys]

Bonjour,
Quel code avez-vous utilisé dans votre css ?

[doriane74]

Bonsoir,
Je vous mets copie du CSS car je ne vois pas de quel code vous vous parlez

Couleurs et taille du texte
Couleur du Texte :
#FF66CC
Couleur du Lien :
#FF66CC
Couleur du Lien Visité :
#34CD57
Couleur du Lien Actif :
#720008
Couleur du Lien survolé :
#F00FA2
Police Titre :
Visualiser l'apparence des polices Google Fonts ici.
TrebuchetMS
Police Principale :
Verdana,Arial,Helvetica,sans-serif
Police Code :
Courier,'CourierNew',sans-serif
Taille Police Principale :
20
Couleur Police Citation :
#F00FA2
Couleur initiale du groupe [Administrateur] :
#FF66CC
Couleur initiale du groupe [Modérateur] :
#FF66CC
Couleur du titre du forum :
Couleur de l'en-tête des colonnes :
#FFFFFF
Les couleurs de fond
Couleur du fond de page :
#FF66CC
Couleur intérieure du cadre du forum :
#000000
Couleur de fond 1 :
#000000
Couleur de fond 2 :
#000000
Couleur de fond 3 :
#000000
Couleur des citations, codes et boutons :
#0A2A16
Couleur zones de saisie, menus déroulants et cadre de l'en-tête :
#15532C
Couleur de fond de l'en-tête (header) :
Couleur de survol :
#1A1619
Couleur de fond d'un message remercié :
#000000
Couleur de fond de l'éditeur (Barre de menu) :
#F7F7F7
Couleur de fond de l'éditeur (Zone de saisie de texte) :
#FFFFFF
Les contours
Couleur du cadre du forum :
#FF1CC0
Couleur du cadre des tables :
Couleur du cadre des cellules :
#FF66CC
Couleur Fond En-tête Catégorie :
Couleur Fond Catégorie :
#000000
Couleur Cadre Catégorie :
#FF1CC0
Couleurs de la barre de défilement
Face supérieure :
#E4B6DB
Contour :
#000000
Relief (Contour bas et droite) :
#000000
Flèche de direction :
#FF1CC0
Fond :
#FF66CC
Scrollbar 3dlight :
#FFFFFF
Scrollbar Darkshadow :
#000000
Galerie
Style et contour des photos :
Ombre Bordure
Couleur des albums et des catégories :
#FFFFFF
Couleur de l'ombre des albums, catégories et photos :
#888888
Couleur de contour des albums et des catégories :
#000000
Version mobile
Couleur du fond de page :
#F5F5F5
Couleur Fond En-tête Catégories et forums :
#0598E4
Couleur du bouton "Rejoindre" :
#3793FF
Couleur de la toolbar Google Chrome (Android) et Safari (iOS) :
#F2F2F2
Prévisualisation
400x300640x480800x6001024x7681152x6841152x8641280x960

Merci pour votre aide

[MlleAlys]

Bonjour,
Si j'en crois ce que vous avez copié/collé, il s'agit de l'onglet "couleurs" et non pas de l'onglet "feuille de style css" n'est ce pas ? Vous n'avez donc rien dans la zone de saisie de l'onglet "feuille de style css" ?




Pour modifier uniquement la taille du texte du contenu des messages affichés :
- rendez-vous dans l'onglet "feuille de style css"
- dans la grande zone de saisie, copiez/collez le code css suivant :

Code:



/*taille du texte dans les messages/
.postbody .content {
    font-size: 20px;
}




- cliquez sur "valider"
- actualisez votre forum et vérifiez l'affichage des messages
- si besoin, modifiez dans le code la valeur de 20px par celle que vous souhaitez.



Pour modifier la taille du texte dans l'éditeur, c'est un peu plus compliqué, surtout en mode wysiwyg que vous semblez utiliser, il faut passer par un javascript et je ne sais pas exactement comme il gère la taille lors de l'affichage de balises un peu plus développées, mais à tester :
- rendez-vous dans modules > Gestion des codes Javascript
- vérifiez que l'option "Activer la gestion des codes Javascript" est sur OUI
- cliquez sur "créer un nouveau javascript"
- remplissez ainsi :
- Titre : Taille du texte éditeur
- Placement : sur toutes les pages
- code javascript :

Code:

$(function() {
  var a = $("#text_editor_textarea");
  0 != a.length && $(function() {
    $('.sceditor-container textarea').css('font-size','20px');
    a.sceditor && a.sceditor("instance") && a.sceditor("instance").css("body,p{font-size:20px}");
  });
});

- cliquez sur "valider"
- actualisez votre forum et vérifiez la taille du texte dans l'éditeur.
- si besoin, modifiez dans le code les valeurs de 20px au bout des lignes 4 et 5 par celle que vous souhaitez.

[doriane74]

Bonjour MlleAlys
Mille mercis pour votre réponse.

J'ai essayé feuille de style CSS mais en cliquant dessus je tombe sur :

body
{
cursor: url("http://downloads.totallyfreecursors.com/thumbnails/bleedinghearts.gif"), auto;
}




.sceditor-emoticons {width: 250px !important; height: 250px !important; overflow: auto !important;}
img.smiley {width: auto !important; height : auto !important;}


alors je ne sais pas où copier votre 1er lien...

Par contre, j'ai essayé avec javascript, ça a l'air de fonctionner.

Mais est-il préférable d'utiliser le 1er lien ou le 2ème ?

Merci pour votre aide, bonne journée

[MlleAlys]

Les deux codes que j'ai donnés se complètent : le premier (css) règle la taille du texte dans les messages affichés dans les forums, le deuxième (javascript) règle la taille du texte dans l'éditeur.


Pour installer le code css, vous pouvez le mettre après ceux que vous avez déjà : Allez tout à la fin des codes que vous avez, passez quelques lignes pour bien les séparer, et collez le nouveau. (l'ordre des codes n'a pas d'importance, mais il ne faut pas qu'ils soient imbriqués, d'où le fait de bien les séparer en passant quelques lignes)

[doriane74]

Re-bonjour MlleAlys
J'ai donc mis les 2 codes en taille 30 dans feuille de style CSS
Dans gestion couleur et CSS, j'ai mis également 30

Des personnes trouvent que la taille de l'écriture à la lecture est bonne , mais encore petite lorsqu'on écrit un message.
Peut-on y remédier ?

Désolée de vous importuner, merci par avance

[MlleAlys]

30px ça parait déjà très gros, vos utilisateurs concernés ont-ils vérifié le niveau de zoom de leur navigateur ? Peut être que ça peut venir de là, si l'affichage est dézoomé, ils verront en plus petit que ça ne l'est réellement.

Pourquoi parlez-vous de deux codes dans la feuille de style css ? Il n'y a qu'un seul code css à mettre dans la feuille de style, l'autre est un code javascript à mettre dans les javascript ?

Pour modifier la taille du texte quand on écrit un message, c'est bien la taille du texte dans l'éditeur qu'il faut modifier, c'est donc la taille indiquée dans le javascript : A la fin des lignes 4 et 5, vous pouvez mettre plus gros que 20 ou 30px.

[doriane74]

Bonjour MlleAlys
Je me suis mal exprimée, j'ai mis les 2 codes : un dans CSS, un dans javascript
Moi aussi, je trouve que c'est déjà bien gros, je vais demander aux utilisateurs de vérifier le niveau du zoom de leur navigateur...
Merci pour votre aide précieuse.
Je vous souhaite un bon week-end, bien amicalement