rich: значок календаря не отображается в той же строке, что и окно отображения

Question

У меня есть веб-приложение на основе Java с использованием Java Server Faces и Facelets.

Я ввожу диапазон дат, используя календарь richfaces .

Вот код на веб-странице.

<h:panelGroup>
    <fieldset>
        <legend>Date Submitted</legend>
        <rich:calendar value="#{SearchBean.start_dateSubmitted}" />
        <rich:calendar value="#{SearchBean.end_dateSubmitted}" />
    </fieldset>
</h:panelGroup>

Вот результаты в Firefox.

альтернативный текст http://img16.imageshack.us/img16/3717/richcalendar.png

Итак, моя проблема в том, что значок находится на следующей строке, а не на той же строке, что и окно дисплея.

Answer 1

Решение:

Была общая настройка CSS для тега HTML изображения.

img {
    display: block;
}

Поскольку богатый календарь состоит из входных данных и изображения, они отображались в виде блоков, которые помещают их в разные строки.

Я не мог просто взять строку css, потому что это отрицательно сказалось бы на остальной части веб-приложения. Таким образом, он должен был быть переопределен с помощью следующего кода CSS.

img.rich-calendar-button {
    display: inline;
}

Однако теперь все четыре элемента расположены на одной строке. Чтобы это исправить, вам нужно заблокировать весь богатый календарь следующим образом.

<h:panelGroup>
    <fieldset>
       <legend>Date Submitted</legend>
       <a4j:outputPanel layout="block">
           <rich:calendar value="#{TicketSearchBean.start_dateSubmitted}" />
       </a4j:outputPanel>
        <a4j:outputPanel layout="block">
            <rich:calendar value="#{TicketSearchBean.end_dateSubmitted}" />
        </a4j:outputPanel>
    </fieldset>
</h:panelGroup>

Лучшее решение: Не устанавливайте CSS для общих тегов HTML. Если вы хотите установить специальный CSS для чего-то, создайте для него класс.