alinear input:text con listas

[cris_maco]

hola!!

Vereis ahora tengo echa una lista no ordenada y con input:text en cada elemento de la lista para introducir datos, lo que pasa es que quiero alinear esos input para que esten todos a la misma medida y tal y ahora lo unico que se me ocurrio fue meter espacios en blanco. Ya probe a encerrar el input:text entre un div con align=center pero lo que hace es que se coloque una linea por abajo. Queria saber si hay alguna otra solucion menos rudimentaria que la mia... y tambien preguntar como puedo cambiar el espaciado que hay entre cada elemento de la lista ya que con los inputs me quedan muy pegados.

Les pongo el codigo que tengo:

Código PHP:

  <blockquote><blockquote><blockquote><blockquote><blockquote><blockquote>
  <ul>
    <li><img src="../fotos/flecha.gif" height="15" /><span onmouseover="doTooltip(event,mensaje2)" onmouseout="hideTip()">Expediente:</span>&nbsp;&nbsp;&nbsp;<html:text property="numExp" style="font-weight: bold;" size="20" /><br><html:errors property="numExpJ" /></li>
    <li><img src="../fotos/flecha.gif" height="15" /><span onMouseOver="doTooltip(event,fechas)" onMouseOut="hideTip()">Fecha:</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<html:text property="fecha" style="font-weight:bold;" size="20"/><html:errors property="fechaJ" /></li>
    <li><img src="../fotos/flecha.gif" height="15" /><span onMouseOver="doTooltip(event,horas)" onMouseOut="hideTip()">Hora:</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<html:text property="hora" style="font-weight:bold;" size="20"/><html:errors property="horaJ" /></li>
    <li><img src="../fotos/flecha.gif" height="15" /><span onMouseOver="doTooltip(event,mensaje1)" onMouseOut="hideTip()">Tipo:</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<html:text property="tipo" style="font-weight:bold;" size="20"/><html:errors property="tipoJ" /></li>
    <li><img src="../fotos/flecha.gif" height="15" /><span onMouseOver="doTooltip(event,mensaje1)" onMouseOut="hideTip()">Sala:</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<html:text property="sala" style="font-weight:bold;" size="20"/><html:errors property="salaJ" /></li>
  <li><input type="radio" id="juicio" name="evento" value="juicio"/>Juicio  <input type="radio" id="plazos" name="evento" value="plazos"/>Plazos</li>
      <li><img src="../fotos/flecha.gif" height="15" /><span onMouseOver="doTooltip(event,mensaje1)" onMouseOut="hideTip()">Descripcion (200 caracteres max.)</span></li>
      <li><textarea  name="juicio" cols="31" rows="4"></textarea><html:errors property="juicio" /></li>
</ul>
 
</blockquote></blockquote></blockquote></blockquote></blockquote></blockquote> 
   

le tengo puesto una sangria para alinearlo en el centro y que quedara bien colocado porque probe usando unca capa pero se me descolocaba .
perdon que tengo html:text(es que uso struts), pero es lo mismo que con input salvo algunos parametros

aqui pueden ver una captura:
http://www.megaupload.com/?d=7GJDVZD6
gracias

[cris_maco]

Me contesto a mi misma por si alguien lo necesita:

www.librosweb.es, ahi lo encontre.
div {
margin: .5em 0;
}
div label {
width: 15%;
float: left;
}

con estas propiedades y envolviendo cada li con:
<li><div><label for="nombre">Nombre</label><input type="text" /></div>

yo luego lo que tambien hice para centrarlo en mi pagina fue envolverlo en otra capa y situar esa capa
va perfecto