Error Css: Vertical Align In Td With Input Text And Image

I have a table with a cell with 2 items (input text and image). I try to align them vertically but it does not work. I try use vertical-align:middle, margin top, padding, try set h

Solution 1:

Add vertical-align: middle to .campoOpcional input and it works - see demo below:

.campoOpcionalinput {
  vertical-align: middle;
}

<tablecellspacing="0"rules="all"border="1"id="Origen"style="width:100%;border-collapse:collapse;"><tr><tdclass="cabeceraDG">Origen</td><tdclass="cabeceraDG">Centro</td><tdclass="cabeceraDG">Usuario</td></tr><trstyle="white-space:nowrap;"><tdclass="campoOpcional">oficina</td><tdclass="campoOpcional"align="center"style="width:150px;"><inputname="Origen$ctl02$referenciaTextBox"type="text"value="0000"id="Origen_ctl02_referenciaTextBox"class="campoOpcional"onblur="return validate(this)"ref="0991" /><inputtype="image"name="Origen$ctl02$imgBtnGuardarCentro"id="Origen_ctl02_imgBtnGuardarCentro"title="Guardar"AutoPostBack="false"src="https://s30.postimg.org/usmf6nsn5/boton_Abonar.gif"onclick="return ASPxClientEdit.ValidateGroup();  msGuardar();"style="border-width:0px;" /></td><tdclass="campoOpcional">TEST</td></tr></table>

Solution 2:

Use this code,

input inside the campoOpcional needed vertical-align

.campoOpcionalinput {
  vertical-align: middle;
}