<hx: inputHelperDatePicker /> пользовательский интерфейс поврежден

Question

Я использую пользовательские компоненты IBM http://www.ibm.com/jsf/html_extended на двух разных страницах, на одной из которых стильно отображается средство выбора даты, как на левой фотографии photo1 и ее код

<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>

Затем я снова использовал этот код на другой странице, но нашел результат, похожий на правильную фотографию, на ссылку photo1 выше.
и код

<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>

Так в чем же проблема использования этого компонента?

Answer 1

Второй код не может явно указать шрифт, в отличие от первого фрагмента, который, по-видимому, приводит к неправильному размеру шрифта на второй фотографии.