Change input field with css

Question

I have a JSF button with input field:

enter image description here

<h:outputLabel for="rowsPerPage" value="Rows per page" />
<h:inputText id="rowsPerPage" value="#{AccountsController.rowsPerPage}" size="3" maxlength="3" style="border: 1px solid #006; height: 24px; border-radius: 3px 3px 3px 3px;" />
<h:commandButton styleClass="bimage" value="Set" action="#{AccountsController.pageFirst}" >
    <f:ajax render="@form" execute="@form"></f:ajax>
</h:commandButton>&nbsp;
<h:message for="rowsPerPage" errorStyle="color: red;" />

As you can see the input field is below the "set" button. How can I make the button and the input field on one line with css. And also how I can make the input field look like the button?

EDIT: This is the html code:

<input id="form:rowsPerPage" type="text" name="form:rowsPerPage" value="10" maxlength="3" size="3" style="border: 1px solid #006; height: 24px; border-radius: 3px 3px 3px 3px;" />

If your question relates specifically to css/html, please post the rendered html from the browser. If it relates to the JSF code, please add the JSF tag to your question. — James Montagne
– James Montagne, Commented Sep 20, 2012 at 16:52

Ivozor · Accepted Answer · 2012-12-07 14:50:57Z

1

Try adding margin-top: 1px to your button.

answered Dec 7, 2012 at 14:50

Ivozor

9869 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Change input field with css

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related