1

Java Server Faces と Facelets を使用した Java ベースの Web アプリケーションがあります。

richfaces calendarを使用して日付範囲を入力しています。

これがWebページのコードです。

<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

したがって、私の問題は、アイコンが次の行にあり、表示ボックスと同じ行にないことです。

4

1 に答える 1

1

解決：

imagehtmlタグには一般的なcss設定がありました。

img {
    display: block;
}

リッチカレンダーは入力と画像で構成されているため、2つを異なる行に配置するブロック形式で表示されました。

Webアプリケーションの他の部分に悪影響を与えるため、cssの行を削除することはできませんでした。そのため、次のコードcssコードでオーバーライドする必要がありました。

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

ただし、これにより、4つの要素すべてが1行に配置されます。これを修正するには、そのようにリッチカレンダー全体をブロックする必要があります。

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

より良い解決策：一般的なhtmlタグにcssを設定しないでください。何かに特別なcssを設定したい場合は、そのクラスを作成します。

于 2009-07-10T17:37:36.933 に答える