<hx: inputHelperDatePicker /> UI corrompu

Question

J'utilise IBM http://www.ibm.com/jsf/html_extended composants personnalisés dans deux pages différentes, l'un d'entre eux affiche un sélecteur de date d'une manière élégante comme la photo de gauche photo1 et son code

<tr> 
 

 
    <td width="20%">To Date: 
 
    <FONT id="toDtColor" color="red" style="display:inline">*</FONT> 
 
    </td> 
 
    <td width="30%"> 
 
    <h:inputText id="textSearchToDate1" value="#{SearchTransactionView.searchToDate}" styleClass="mediumInput" disabled="false" readonly="false"> 
 
     <hx:convertDateTime timeZone="#{BaseBean.defaultTimeZone}" pattern="EEE, dd MMM yyyy" /> 
 
     <hx:inputHelperDatePicker id="datePicker1" /> 
 
     <hx:inputHelperAssist errorClass="inputText_Error" id="assist1" /> 
 
    </h:inputText><br/> 
 
    <h:message for="textSearchToDate1" styleClass="fieldError"></h:message> 
 
    </td> 
 
</tr>

Puis j'ai réutilisé ce code dans une autre page, mais j'ai trouvé le résultat comme la bonne photo dans le lien photo1 ci-dessus.
et le code est

<tr> 
 
    <td width="20%" valign="top">User Expiration Date:</td> 
 
    <td width="30%"> 
 
    <h:inputText id="UserExpirationDate" value="#{AddUserView.userExpiryDate}" styleClass="mediumInput"> 
 
     <hx:convertDateTime timeZone="#{BaseBean.defaultTimeZone}" pattern="EEE, dd MMM yyyy" /> 
 
     <hx:inputHelperDatePicker id="datePicker100" /> 
 
    </h:inputText> 
 
    <br/> 
 
    <h:message for="UserExpirationDate" styleClass="fieldError"></h:message> 
 
    </td> 
 
</tr>

Alors, quel est le problème de l'utilisation de ce composant?

Answer 1

Le deuxième code ne parvient pas à spécifier une police explicitement différente du premier extrait qui semble provoquer une taille incorrecte de la police dans la deuxième photo.