Forum:

Formatting problem.

Ranch Hand

Posts: 276

posted 19 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I have a page where I want to display an image at the top, a scrollable panel in the middle, and a button at the bottom. I get all of these components, but they are all inside of the scroll panel and I don't understand why.

Here is the code:

<f:view>
        <html lang="en-US" xml:lang="en-US">
            <head>
                <meta content="no-cache" http-equiv="Cache-Control"/>
                <meta content="no-cache" http-equiv="Pragma"/>
                <title>DisplayDiagnosis Title</title>
                <link href="resources/stylesheet.css" rel="stylesheet" type="text/css"/>
            </head>
            <body style="-rave-layout: grid">
                <h:form binding="#{DisplayDiagnosis.form1}" id="form1">
                    <h:panelGrid binding="#{DisplayDiagnosis.centeringGridPanel}" columns="1" id="centeringGridPanel">
                        <h:graphicImage binding="#{DisplayDiagnosis.image1}" id="image1" value="resources/myLogo.JPG"/>
                        <h:panelGrid binding="#{DisplayDiagnosis.diagnosisPanel}" columns="3" footerClass="" id="diagnosisPanel">
                            <div style="height: 250px; width: 400px; overflow: auto">
                            </div>
                        </h:panelGrid>
                        <h:panelGroup binding="#{DisplayDiagnosis.groupPanel1}" id="groupPanel1" style="height: 50px; width: 100px">
                            <h:commandButton binding="#{DisplayDiagnosis.button1}" id="button1" onclic="history.back(); return false" value="Back"/>
                        </h:panelGroup>
                    </h:panelGrid>
                </h:form>
            </body>
        </html>
    </f:view>

How should this look in order to get the image above the scroll panel and the button below it?

Note that I tried surrounding the DiagnosisPanel (the only one I want to scroll) with the div tag, but that didn't do what I expected.

In short, how do I get the DiagnosisPanel to be the only thing that scrolls?

Thanks.
[ October 07, 2005: Message edited by: Darrin Smith ]

Bear Bibeault

Sheriff

Posts: 67750

173

I like...

posted 19 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Where are the f and h custom actions from?

[Asking smart questions] [About Bear] [Books by Bear]

HTML 5 (verified skill)
Skill verified by Jeanne Boyarsky

CSS 3 (verified skill)
Skill verified by Jeanne Boyarsky

JavaScript (verified skill)
Skill verified by Jeanne Boyarsky

Darrin Smith

Ranch Hand

Posts: 276

posted 19 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Originally posted by Bear Bibeault:
Where are the f and h custom actions from?

Oh, sorry...that is JSF stuff (using Java Studio Creator), but I figured this really wasn't a JSF question, but rather a simple JSP one since you all deal with this sort of thing.

Bear Bibeault

Sheriff

Posts: 67750

173

I like...

posted 19 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Moved to the JSF forum.

[Asking smart questions] [About Bear] [Books by Bear]

Darrin Smith

Ranch Hand

Posts: 276

posted 19 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I changed it around a little, and now I get the image to stay at the top, but the button is still inside of the scroll pane. Why this is I have no ideas when the image is correct.

Anyway, here is what it looks like now. Any ideas on how to get the bottom out of the scroll pane?

Denise L Smith

Greenhorn

Posts: 7

posted 18 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Did you try using the Facet tags... footer and header?
<h

ataTable id="books"
columnClasses="list-column-center,
list-column-right, list-column-center,
list-column-right" headerClass="list-header"
rowClasses="list-row" styleClass="list-
background" value="#{BookStore.items}" var="store">
<h:column>
<f:facet name="header">
<h

utputText value="#{msg.storeNameLabel}"/>
</f:facet>
<h

utputText value="#{store.name}"/>
</h:column>
<h:column>
<f:facet name="header">
<Subject
</f:facet>
<h

utputText value="#{store.subject}"/>
</h:column>
<h:column>
<f:facet name="header">
<h

utputText value="#{msg.storePriceLabel}"/>
</f:facet>
<h

utputText value="#{store.price}"/>
</h:column>
</h

ataTable>

resource http://www.exadel.com/tutorial/jsf/jsftags-guide.html

The courage to learn anything...that's what I look for.

Dinner will be steamed monkey heads with a side of tiny ads.

We need your help - Coderanch server fundraiser

https://coderanch.com/wiki/782867/Coderanch-server-fundraiser