Tema: Como posicionar un <form> con css?
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 30/04/2015, 09:15
IVICP3
 
Fecha de Ingreso: febrero-2015
Mensajes: 61
Antigüedad: 9 años, 11 meses
Puntos: 0
Como posicionar un <form> con css?
Tengo este form, con un input text y un input submit pero esta mal colocado, lo quiero colocar a la altura de la linea, pero no puedo por mucho que le ponga margins en css, no se mueve.



Código HTML: 
Ver original
  1. <ul class="nav nav-tabs">
  2. <li id="left" ><a href="index.php" class="glyphicon glyphicon-home" style="cursor:pointer; background:"> Home</a></li>
  3.     <li ><a href="perfil.php" class="glyphicon glyphicon-user" style="cursor:pointer; background:"> Perfil</a></li>
  4.     <li ><a href="chat.php" class="glyphicon glyphicon-envelope" style="cursor:pointer; background:"> Chat</a></li>
  5.     <li ><a class="glyphicon glyphicon-plane" style="cursor:pointer; background:"> Lugares</a></li>
  6.     <li ><a href="salir.php" class="glyphicon glyphicon-remove-sign" style="cursor:pointer"> Salir</a></li>
  7.     <form class="buscar" action="buscar.php" method="POST">
  8.     <input id="buscar" type="text" name="buscarusu" placeholder="Buscar usuario" size="11"> 
  9.     <input type="submit" value="Buscar">
  10.     </form>
  11. </ul>

Código CSS: 
Ver original
  1. #buscar{
  2.   margin-bottom: 35px;
  3. }




En cambio, si quito el <form> y dejo los input , queda asi.




Código HTML: 
Ver original
  1. <ul class="nav nav-tabs">
  2. <li id="left" ><a href="index.php" class="glyphicon glyphicon-home" style="cursor:pointer; background:"> Home</a></li>
  3.     <li ><a href="perfil.php" class="glyphicon glyphicon-user" style="cursor:pointer; background:"> Perfil</a></li>
  4.     <li ><a href="chat.php" class="glyphicon glyphicon-envelope" style="cursor:pointer; background:"> Chat</a></li>
  5.     <li ><a class="glyphicon glyphicon-plane" style="cursor:pointer; background:"> Lugares</a></li>
  6.     <li ><a href="salir.php" class="glyphicon glyphicon-remove-sign" style="cursor:pointer"> Salir</a></li>
  7.     <input id="buscar" type="text" name="buscarusu" placeholder="Buscar usuario" size="11"> 
  8.     <input type="submit" value="Buscar">
  9. </ul>


Código CSS: 
Ver original
  1. #buscar{
  2.   margin-top: 15px;
  3. }



Porque pasa esto? Si quiero pasar los datos del input text, da igual si pongo <form> o no? Como se haria?


Gracias.