Forum Communauté Jeedom

Bonjour,

J'affiche dans un tableau une valeur numérique issue d'un virtuel.
Comme je trouve le design de ce widget sympa, j'ai sélectionné son affichage avec le widget "badge (core)" pour lequel j'ai supprimé l'affichage du nom.
J'ai l'option du tableau "Centrer dans les cases" cochée.

J'ai le soucis suivant :
Lorsque ce widget se trouve dans la case du tableau, il s'affiche décentré et collé verticalement en haut.
J'ai essayé de modifier sa position en ajoutant des commandes CSS dans la case du tableau (padding-top : 40px; par exemple) mais je n'arrive pas à un résultat sympa par rapport aux cases adjacentes avec des textes centrés. La hauteur de ligne devient prohibitive.

On dirait que la hauteur du widget est bien supérieure à la zone affichée (cadre de couleur bleue).
Est-ce cela et y a t-il une raison à cette hauteur (valeur height:) ?

Un avis ? Comment faire pour prendre la main ?
Je vous remercie.

Salut,

...Une petite copie d'écran du tableau et du rendu stp ?

Bonsoir Salvialf et merci pour ta réponse et proposition de support.

Comme j'ai pas mal avancé sur ma question, je décris ici pour la communauté comment j'ai solutionné mon besoin.

Je confirme tout d'abord que le code du widget badge (core) montre bien une hauteur exprimée en min-height de 60 px alors que la pastille bleue qui indique les chiffres et l'unité ne fait que 28 px de haut.
Cette hauteur de 60 px a peut être du sens si on demande dans les options d'affichage d'afficher le nom (et éventuellement l'icone), je ne sais pas, mais si on ne veut retenir que la pastille bleue, il est très difficile de pouvoir la centrer dans les cases d'un tableau (en tout cas, je n'y suis pas arrivé).

Afin de contourner le problème, je me suis permis de récupérer le code du widget (core) sur GitHub, de le modifier pour mon besoin et de créer un nouveau widget avec le code modifié.
Les modifications apportées sont les suivantes :
- en ligne #1 : min-height : 60px; remplacé par min-height: 28px;
- en ligne #4 : position:relative;top:2px remplacé par position:relative;top:3px;
(au passage, il me semble qu'il manque un point virgule après la valeur du top dans le code du core ... )

Du coup, on peut avoir un badge qui se centre très bien dans la case d'un tableau. Pour info, de mon coté, J'ai fixé la hauteur des lignes correpondantes à 40 px.

Mon application est un tableau récapitulatif des données transmise par mon compteur Linky sur la télé-information (TIC).
Pour les connaisseurs, je précise que j'ai demandé à Enedis de passer mon compteur du mode "Historique" au mode "Standard" pour la TIC.

Et pour terminer voici comme tu l'as demandé une image du tableau une fois terminé et utilisant le nouveau widget.