Ver Mensaje Individual
  #49 (permalink)  
Antiguo 03/04/2021, 17:42
pilucho
 
Fecha de Ingreso: noviembre-2004
Ubicación: NULL
Mensajes: 652
Antigüedad: 19 años, 5 meses
Puntos: 6
Respuesta: live search php

Hola Alexis88 al parecer no tiene compatibilidad con /bootstrap/ hice las pruebas sin usar style, y hasta cierta clase funciona
pero si empiezo a utilizar col-, form-group, card, etc.. se alinea el texto en otra ubicación en este caso en el "top left"
ya que es tu código seria bueno que haya compatibilidad con bootstrap para que la apariencia quede mas agradable

en resumen sin estilos de bootstrap funciona todo OK
pero con estilo bootstrap no funciona se desalinea .


Código HTML:
Ver original
  1. <section class="content">
  2.       <div class="container-fluid">
  3.         <!-- row (main row) -->
  4.         <div class="row">
  5.          <!--  SI COLOCO AQUI EL <form>...  ME FUNCIONA, TODO BIEN -->
  6.           <div class="col-12">
  7.             <div class="form-group card col-md-8 py-2">
  8.  
  9.  
  10.  
  11. <!--
  12. SI COLOCO EL CODIGO <form> DENTRO DEL "form-group card col-md-auto py-2"  
  13. me aparece el cuadro de input al lado izquierdo de arriba,
  14. -->
  15.  
  16.     <section>
  17.         <label>Buscar por nombre:</label>
  18.         <input type="search" name="byName" autofocus />
  19.     </section>
  20.  
  21.     <section>
  22.         <label>Buscar por correo:</label>
  23.         <input type="search" name="byEmail" autofocus />
  24.     </section>
  25.  
  26.     <hr />
  27.  
  28.     <section>
  29.         <label>Resultados seleccionados:</label>
  30.         <p>
  31.             <input type="text" name="nombre" readOnly />                
  32.         </p>
  33.         <p>
  34.             <input type="text" name="correo" readOnly />                
  35.         </p>
  36.     </section>
  37. </form>
  38.  
  39.  
  40.  
  41.  
  42.             </div><!-- form-group card col-md-auto py-2 -->
  43.           </div><!-- col -->
  44.         </div><!-- row (main row) -->
  45.       </div><!-- container-fluid -->
  46.     </section><!-- content -->