Text & Image Layout in JSF

i am trying to make image and text display at same line by using JSF tag. is there any way to do that? oringinal code is like following but image and text always displays in 2 lines.

    <rich:modalPanel id="Busy" autosized="true" zindex="2000">
        <h:outputText value="Submitting...开发者_如何转开发"></h:outputText>
        <h:graphicImage value="images/loading.gif" />
    </rich:modalPanel>

You can try this

<rich:modalPanel id="Busy" autosized="true" zindex="2000">
   <h:panelGrid columns="2">
      <h:outputText value="Submitting..."></h:outputText>
      <h:graphicImage value="images/loading.gif" />
   </h:panelGrid>
</rich:modalPanel>

The will arrange all its child elements in a table, containing the specified number of columns (2 in this case).

h:panelGrid

The best solution is to define the line directly in the CSS properties:

<h:outputText value="Submitting..." styleClass="loading"/>

and in your CSS:

.loading {
    background-image: url('images/loading.gif');
}

then, you will have to adapt your CSS class to display correctly your image.