Discussion :

[Lolosan]

Bonjour à tous,

je rencontre un problème concernant le composant p:outputPanel. En fait le problème est plus au niveau du design qu'autre chose mais bon. J'ai ce code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
<p:dataList id="serveurlist" value="#{pageInstanceBean.serveurs}" var="serveur" itemType="circle">  
    #{serveur.hostname}, #{serveur.idTypeServeur.nomTypeServeur}, 
    <p:commandLink value=" Remote," rendered="#{serveur.idTypeServeur.tse == 'true'}" onclick="process('#{serveur.hostname}')"/>
    <p:commandLink value=" Scripts," rendered="#{serveur.idTypeServeur.script == 'true'}" onclick="script('coucou')"/>
    <p:outputPanel rendered="#{serveur.idTypeServeur.http == 'true'}">
    	<a href="#{pageInstanceBean.chaineHttp(serveur)}"> Http</a>
    </p:outputPanel>
</p:dataList>

Qui me fournit ce résultat :


En fait le outputPanel me créer un retour à la ligne, alors que je voudrais qu'il sois à la suite de mon "Scripts, Http". Doit-je utiliser un autre composant que outputPanel ou alors il existe une solution en css ?

Merci

[Mishulyna]

Bonjour,

Des solutions en CSS existent: augmenter la largeur du panel, diminuer son "padding-right" (ou la taille de la police du hyperlien)...

[Lolosan]

J'ai tenté en css de modifier le width, ou bien le padding-right mais rien n'y fait...

[Mishulyna]

Tu as essayé comment?
Pour les composants PrimeFaces il est utile des fois d'ajouter "!important" dans le style. Il est encore plus utile d'effacer l'historique de navigation avant d'exécuter après une modification du css.

[Lolosan]

J'ai mis le code suivant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
.ui-outputpanel {
width : 30px !important
padding-right : 0px !important
}

Effectivement je n'avais pas pensé aux !important mais ils n'ont rien changé...

[Mishulyna]

30 px ce n'est pas énorme comme valeur.

Essaye

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<p:outputPanel style="width: 50px; padding-right: 0" rendered="#{serveur.idTypeServeur.http == 'true'}">
    	<a href="#{pageInstanceBean.chaineHttp(serveur)}"> Http</a>
    </p:outputPanel>

Et efface l'historique de navigation sur la page de ton application, des fois le navigateur t'affiche une version plus ancienne de la page.

[Lolosan]

Oui je teste avec de grandes valeurs mais aussi avec des valeurs beaucoup plus faible pour voir si le code que je tape à vraiment une influence sur le rendu. J'ai supprimé mon historique de navigation et testé avec ton code, mais aucun changement. Pour te dire j'ai même testé avec un width de 0px, mon http est toujours présent et à la ligne...

Mais j'ai réussi par trouver :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<p:outputPanel style="display: inline-block;" rendered="#{serveur.idTypeServeur.http == 'true'}" >						
       <a href="#{pageInstanceBean.chaineHttp(serveur)}">Http</a>	
</p:outputPanel>

Merci bien !