0

Muy buenas tardes compañeros de vocación quisiera que me ayuden con esta duda, en un trabajo que estoy realizando estoy trayendo campos de una base de datos como ven a continuación

como ven se están ubicando una debajo de la otra lo que necesito esque se pongan correctamente una alado de la otra cada elemento, y cuando se llene la pantalla se sigan ubicando debajo

ya he tratado algunas maneras pero ninguna se ajusta correctamente, les dejo el código a continuación

<div>
   <table class="table table-striped">
      <table border ="1" >
          
          <?php 
                $sql="SELECT firstname,lastname,user_email,user_id from users where nivel = 1";
                $result=mysqli_query($con,$sql);
                while($mostrar=mysqli_fetch_array($result)){
              ?>

          
  
        
        
        <tr>
           <div class="row">
               <div class="col-lg-4">
                  
           <svg class="bd-placeholder-img rounded-circle" width="140" height="140" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: 140x140" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#777"/><text x="50%" y="50%" fill="#777" dy=".3em">140x140</text></svg>
          </div><!-- /.col-lg-4 -->
           <h2><?php echo $mostrar['firstname'] ?></h2>
           <p><?php echo $mostrar['user_email'] ?></p>
           <p><a class="btn btn-secondary" href="#">Hoja de vida </a></p>
           </div>
                  
               </div><!-- /.col-lg-4 -->
          </div><!-- /.row -->


        <tr>
  
        <?php 
        }
         ?>
    </table>
  </table>
</div>
          

este básicamente es el código que estoy ejecutando y si me ayudarían con algún consejo para que cuando den click en "hoja de vida" se abra otro formulario donde aparezca la información respectiva a su usuario que estoy obteniendo de otras tablas que están relacionadas , les agradecería mucho también.

les agradezco mucho de antemano, lindo día.

2
  • Estas usando boostrap?
    – Edgar Gc
    Commented el 29 abr. 2021 a las 4:36
  • si estoy usando amigo Commented el 29 abr. 2021 a las 4:55

2 respuestas 2

0

En el código que tienes de la tabla, solo has definido las filas (<tr>). Te hace falta definir las celdas (<td>). Puede poner cada elemento dentro de la celda

<tr>
     <td> Aqui pones el SVG </td>
     <td> Nombre </td>
     <td> Apellido </td>
     <td> Hoja de Vida </td>
</tr>
0

Si estas usando Bootsrap, en vez de usar una tabla para eso puedes usar el "Grid System" de bootstrap. Grid system

Básicamente el grid de bootstrap te "divide" el row o fila en 12 partes y a la hora te ir a meter tu contenido, puedes elegir cuantas filas ocupa ese contenido. Por ejemplo

<div class="row">
    <div class="col-4">
        Columna 1
    </div>
    <div class="col-4">
        Columna 2
    </div>
    <div class="col-4">
        Columna 3
    </div>
</div>

Esto serían 3 capas div que aparecerian en la misma fila. Cada una de ellas ocupando "4". Al ocupar cada una 4, si metieses otra capa en ese row, saltaria de linea.

También ten en cuenta que hay varias clases para indicar cuantas columnas va a ocupar el div dependiendo de la resolución ( tienes ejemplos en la documentación ). Por ejemplo en tu código estás usando col-lg-4, esto significa que el elemento ocupara 4 columnas en resoluciones "large", que son las mayores a 992px

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.