2009-07-10 5 views
1

Ich habe eine Java-basierte Web-Anwendung mit Java Server Faces und Facelets.reich: Kalender-Symbol nicht in der gleichen Zeile wie Display-Box

Ich gebe einen Datumsbereich unter Verwendung der richfaces calendar ein.

Hier ist der Code auf der Webseite.

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

Hier sind die Ergebnisse in Firefox.

alt text http://img16.imageshack.us/img16/3717/richcalendar.png

So ist mein Problem, dass das Symbol in der nächsten Zeile ist und nicht auf der gleichen Linie wie die Display-Box.

Antwort

1

Lösung:

Es gab ein allgemeines CSS-Setup für den Bild HTML-Tag.

Da der Rich-Kalender aus einer Eingabe und einem Bild besteht, wurden sie in der Blockform angezeigt, die die beiden auf verschiedene Zeilen brachte.

Ich konnte nicht einfach die Linie von CSS herausnehmen, weil es negative Auswirkungen auf den Rest der Webanwendung hätte. Also musste es mit dem folgenden Code css code überschrieben werden.

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

Nun werden jedoch alle vier Elemente in einer Zeile angezeigt. Um dies zu beheben, müssen Sie den gesamten Rich-Kalender wie folgt sperren.

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

bessere Lösung: nicht css auf generische HTML-Tags gesetzt. Wenn Sie spezielle CSS für etwas festlegen möchten, erstellen Sie eine Klasse dafür.