<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <div class="col-md-12 toppad offset-md-0 "> <a href="edit.html" class="float-right" >Cerrar sesion</a> </div> <div class="col-md-6 offset-md-0 toppad" > <div class="card"> <div class="card-body"> <h2 class="card-title">Jose</h2> <table class="table table-user-information "> <tbody> <tr> <td>1er Apellido:</td> <td>Perez</td> </tr> <tr> <td>2do Apellido:</td> <td>Lopez</td> </tr> <tr> <td>Cargo:</td> <td>Empleado</td> </tr> <tr> <td>Alta:</td> <td>12/02/2017</td> </tr> <tr> <td>NIF:</td> <td>a14523687w</td> </tr> <tr> <td>Codigo Postal:</td> <td> <input name="zipCode" type="text" label="08XXX" maxLength="5" value=08123 focus /> </td> </tr> <tr> <td>Email</td> <td> <input icon="email-icon" name="email" type="email" label="" value=joseperez@frjn.com focus /> </td> </tr> <tr> <td>Telefono</td> <td> <input icon="email-icon" name="email" type="email" label="" value={123456789} focus /> </td> </tr> </tbody> </table> <a href="#" onClick={props.handleSubmitProfile} class="btn btn-primary ml-2">Guardar cambios</a> </div> </div> </div> <div class="col-md-6 offset-md-0 toppad"> <div class="card"> <div class="card-body"> <h3 class="card-title">Cambia tu clave</h3> <table class="table table-user-information "> <tbody> <tr> <td>Clave actual:</td> <td> <input icon="password-icon" name="password" type="password" value='' focus /> </td> </tr> <tr> <td>Calve nueva:</td> <td> <Input icon="password-icon" name="newPassword" type="password" value='' /> </td> </tr> <tr> <td>Repita clave nueva:</td> <td> <Input icon="password-icon" name="newPassword" type="password" value='' /> </td> </tr> </tbody> </table> <a href="#" onClick={props.handleSubmitPass} class="btn btn-primary ml-2">Cambiar clave</a> </div> </div> </div> </div> </div>

.user-row { margin-bottom: 14px; } .user-row:last-child { margin-bottom: 0; } .table-user-information > tbody > tr { border-top: 1px solid rgb(221, 221, 221); } .table-user-information > tbody > tr:first-child { border-top: 0; } .table-user-information > tbody > tr > td { border-top: 0; } .toppad {margin-top:20px; }