Try specifying width for the div of the inputbox
Pergunta
I am having a really annoying problem in css. I am trying to align all the text for the input fields in a form (code shown below). For some reason the text that is two words long is kicking on to a second line(for example "First Name" below). Can anyone help me to get it to appear on one line because I've tried changing a lot of things and its just not working for me. Here is the code for the form (in JSF) and also I have attached the relevent CSS code. Thanks
## JSF ##
<div class="register"><h:form id="registerForm">
<div class="white"><h2>Add Business Account</h2></div>
<h:messages errorClass="errorMessage" infoClass="infoMessage"
warnClass="warnMessage"></h:messages>
<table>
<tr>
<td><h:outputLabel for="firstName">
<h:outputText class="generaltext" id="firstNameLabel" value="First Name" />
</h:outputLabel></td>
<td><div class="inputboxpadding"><h:inputText class="inputboxes" id="firstName"
value="#{registerBean.businessAccount.firstName}" size="20" required="true"
requiredMessage="Required field" validatorMessage="First name must contain between 3 and 15 characters">
<f:validateLength minimum="3" maximum="15"/>
<f:ajax event="blur" render="fnamemessage" /></h:inputText>
</div></td>
<td> <div class="validationbox"><h:message id="fnamemessage" for="firstName" class="validation"/></div></td>
</tr>
<tr>
</h:commandButton></div></td>
</tr>
</table>
<h:link value="Back to login" outcome="login" />
</h:form></div>
## CSS ##
.register {
font-family: Arial, Helvetica, sans-serif;
background-color: #6495ED;
width: 500px;
height:auto;
min-height:700px;
margin-left: auto;
margin-right: auto;
margin-top: 50px;
margin-bottom: auto;
border-style: solid;
border-width: 1px;
border-radius: 20px;
padding: 100;
-moz-box-shadow: inset 0 0 10px #000000;
-webkit-box-shadow: inset 0 0 10px #000000;
box-shadow: inset 0 0 10px #000000;
}
.generaltext{
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight:bold;
color: white;
padding-left:20px;
padding-right:20px;
}
Solução
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow